Skip to content

Commit

Permalink
Use Symfony Webpack Encore.
Browse files Browse the repository at this point in the history
  • Loading branch information
bellisk committed Mar 13, 2019
1 parent 48b04e1 commit c0f1ffd
Show file tree
Hide file tree
Showing 16 changed files with 6,941 additions and 28 deletions.
5 changes: 3 additions & 2 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@
/app/config/sculpin_site_*.yml
/app/logs/*
/output_*/
/source/components/
/node_modules/
/source/build/
s3.conf
/vendor/
/vendor/
22 changes: 21 additions & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -28,18 +28,38 @@ A very basic Sculpin based blog supporting the following features:
Install
-------

This application uses [Symfony's Webpack Encore](https://symfony.com/doc/current/frontend.html)
to manage CSS, JavaScript and image assets. First install the JS dependencies:

```bash
$ yarn install
```

Then install the PHP dependencies (Sculpin):

```bash
$ composer install
```

Build
-----

php vendor/bin/sculpin generate --watch --server
First run Encore, to compile the assets in `source/assets/` into `source/build/`:

```bash
$ yarn encore dev --watch
```

Then generate the site with Sculpin:

```bash
$ php vendor/bin/sculpin generate --watch --server
```

Your newly generated clone of sculpin-blog-skeleton is now
accessible at `http://localhost:8000/`.


Previewing Development Builds
-----------------------------

Expand Down
11 changes: 11 additions & 0 deletions package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
{
"dependencies": {
"@symfony/webpack-encore": "^0.24.0",
"bootstrap": "^4.3.1",
"highlightjs": "^9.12.0",
"jquery": "^3.3.1",
"node-sass": "^4.11.0",
"sass-loader": "^7.0.1",
"popper.js": "^1.14.7"
}
}
44 changes: 19 additions & 25 deletions source/_layouts/default.html
Original file line number Diff line number Diff line change
Expand Up @@ -8,30 +8,28 @@
{% block head_meta %}
<meta name="robots" content="noindex, follow">
{% endblock %}
<link href="{{ site.url }}/components/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<link href="{{ site.url }}/css/style.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="{{ site.url }}/build/app.css">

<link rel="apple-touch-startup-image" href="{{ site.url }}/images/jackson/2048x2048.png">
<link rel="apple-touch-startup-image" href="{{ site.url }}/build/2048x2048.png">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<link rel="shortcut icon" sizes="76x76" href="{{ site.url }}/images/jackson/76x76.png">
<link rel="shortcut icon" sizes="120x120" href="{{ site.url }}/images/jackson/120x120.png">
<link rel="shortcut icon" sizes="128x128" href="{{ site.url }}/images/jackson/128x128.png">
<link rel="shortcut icon" sizes="152x152" href="{{ site.url }}/images/jackson/152x152.png">
<link rel="shortcut icon" sizes="196x196" href="{{ site.url }}/images/jackson/196x196.png">
<link rel="shortcut icon" sizes="512x512" href="{{ site.url }}/images/jackson/512x512.png">
<link rel="shortcut icon" sizes="1024x1024" href="{{ site.url }}/images/jackson/1024x1024.png">
<link rel="shortcut icon" sizes="2048x2048" href="{{ site.url }}/images/jackson/2048x2048.png">
<link rel="apple-touch-icon" sizes="76x76" href="{{ site.url }}/images/jackson/76x76.png">
<link rel="apple-touch-icon" sizes="120x120" href="{{ site.url }}/images/jackson/120x120.png">
<link rel="apple-touch-icon" sizes="128x128" href="{{ site.url }}/images/jackson/128x128.png">
<link rel="apple-touch-icon" sizes="152x152" href="{{ site.url }}/images/jackson/152x152.png">
<link rel="apple-touch-icon" sizes="196x196" href="{{ site.url }}/images/jackson/196x196.png">
<link rel="apple-touch-icon" sizes="512x512" href="{{ site.url }}/images/jackson/512x512.png">
<link rel="apple-touch-icon" sizes="1024x1024" href="{{ site.url }}/images/jackson/1024x1024.png">
<link rel="apple-touch-icon" sizes="2048x2048" href="{{ site.url }}/images/jackson/2048x2048.png">
<link rel="shortcut icon" sizes="76x76" href="{{ site.url }}/build/jackson/76x76.png">
<link rel="shortcut icon" sizes="120x120" href="{{ site.url }}/build/jackson/120x120.png">
<link rel="shortcut icon" sizes="128x128" href="{{ site.url }}/build/jackson/128x128.png">
<link rel="shortcut icon" sizes="152x152" href="{{ site.url }}/build/jackson/152x152.png">
<link rel="shortcut icon" sizes="196x196" href="{{ site.url }}/build/jackson/196x196.png">
<link rel="shortcut icon" sizes="512x512" href="{{ site.url }}/build/jackson/512x512.png">
<link rel="shortcut icon" sizes="1024x1024" href="{{ site.url }}/build/jackson/1024x1024.png">
<link rel="shortcut icon" sizes="2048x2048" href="{{ site.url }}/build/jackson/2048x2048.png">
<link rel="apple-touch-icon" sizes="76x76" href="{{ site.url }}/build/jackson/76x76.png">
<link rel="apple-touch-icon" sizes="120x120" href="{{ site.url }}/build/jackson/120x120.png">
<link rel="apple-touch-icon" sizes="128x128" href="{{ site.url }}/build/jackson/128x128.png">
<link rel="apple-touch-icon" sizes="152x152" href="{{ site.url }}/build/jackson/152x152.png">
<link rel="apple-touch-icon" sizes="196x196" href="{{ site.url }}/build/jackson/196x196.png">
<link rel="apple-touch-icon" sizes="512x512" href="{{ site.url }}/build/jackson/512x512.png">
<link rel="apple-touch-icon" sizes="1024x1024" href="{{ site.url }}/build/jackson/1024x1024.png">
<link rel="apple-touch-icon" sizes="2048x2048" href="{{ site.url }}/build/jackson/2048x2048.png">

<link rel="stylesheet" href="{{ site.url }}/components/highlightjs/styles/github.css" />
<link rel="alternate" type="application/atom+xml" href="{{ site.url }}/atom.xml" title="{{ site.title }} activity feed" />
{% block head_styles %}
{% endblock %}
Expand Down Expand Up @@ -85,9 +83,7 @@
<span class="text-muted">&copy; {{ "now"|date("Y") }} {{ site.title }}</span>
</footer>

<script src="{{ site.url }}/components/jquery/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"></script>
<script src="{{ site.url }}/components/bootstrap/js/bootstrap.min.js"></script>
<script src="{{ site.url }}/build/app.js"></script>
{% block scripts %}
{% endblock %}

Expand All @@ -103,8 +99,6 @@
ga('send', 'pageview');
</script>
{% endif %}
<script src="{{ site.url }}/components/highlightjs/highlight.pack.js"></script>
<script>hljs.initHighlightingOnLoad();</script>

{% block scripts_after %}
{% endblock %}
Expand Down
3 changes: 3 additions & 0 deletions source/css/style.css → source/assets/css/app.scss
Original file line number Diff line number Diff line change
@@ -1,3 +1,6 @@
@import "../../../node_modules/bootstrap/scss/bootstrap";
@import "../../../node_modules/highlightjs/styles/github.css";

small {
display: block;
color: #888;
Expand Down
File renamed without changes
File renamed without changes
File renamed without changes
File renamed without changes
File renamed without changes
File renamed without changes
File renamed without changes
File renamed without changes
7 changes: 7 additions & 0 deletions source/assets/js/app.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
require('../css/app.scss');

require('jquery')
require('bootstrap')
var hljs = require('highlightjs')

hljs.initHighlightingOnLoad();
23 changes: 23 additions & 0 deletions webpack.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
var Encore = require('@symfony/webpack-encore');

Encore
// directory where compiled assets will be stored
.setOutputPath('source/build/')
// public path used by the web server to access the output path
.setPublicPath('/build')
.copyFiles({
from: './source/assets/icons'
})
.addEntry('app', './source/assets/js/app.js')

.disableSingleRuntimeChunk()

.cleanupOutputBeforeBuild()
.enableSourceMaps(!Encore.isProduction())
// enables hashed filenames (e.g. app.abc123.css)
.enableVersioning(Encore.isProduction())

.enableSassLoader()
;

module.exports = Encore.getWebpackConfig();
Loading

0 comments on commit c0f1ffd

Please sign in to comment.