diff --git a/package-lock.json b/package-lock.json index f9829d5..762804d 100644 --- a/package-lock.json +++ b/package-lock.json @@ -6283,6 +6283,16 @@ "integrity": "sha1-3z02Uqc/3ta5sLJBRub9BSNTRY4=", "dev": true }, + "mini-css-extract-plugin": { + "version": "0.4.0", + "resolved": "https://registry.npmjs.org/mini-css-extract-plugin/-/mini-css-extract-plugin-0.4.0.tgz", + "integrity": "sha512-2Zik6PhUZ/MbiboG6SDS9UTPL4XXy4qnyGjSdCIWRrr8xb6PwLtHE+AYOjkXJWdF0OG8vo/yrJ8CgS5WbMpzIg==", + "dev": true, + "requires": { + "loader-utils": "^1.1.0", + "webpack-sources": "^1.1.0" + } + }, "minimalistic-assert": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/minimalistic-assert/-/minimalistic-assert-1.0.1.tgz", diff --git a/package.json b/package.json index 5016f18..248089b 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,7 @@ "babel-loader": "^7.1.4", "babel-preset-env": "^1.7.0", "css-loader": "^0.28.11", + "mini-css-extract-plugin": "^0.4.0", "node-sass": "^4.9.0", "postcss-loader": "^2.1.5", "predictor": "git+https://github.com/anwinged/predictor.git", diff --git a/source/_layouts/default.html.twig b/source/_layouts/default.html.twig index bbee56a..0592829 100644 --- a/source/_layouts/default.html.twig +++ b/source/_layouts/default.html.twig @@ -2,7 +2,8 @@ {% include 'head.twig' %} - + + {% block css %}{% endblock %}
@@ -11,11 +12,7 @@ {% include 'counters.twig' %} - - - {% block js %} - {# extra js scripts here #} - {% endblock %} - + + {% block js %}{% endblock %} diff --git a/source/_layouts/internal.html.twig b/source/_layouts/internal.html.twig index e6ecf05..a0f428b 100644 --- a/source/_layouts/internal.html.twig +++ b/source/_layouts/internal.html.twig @@ -2,6 +2,8 @@ {% include 'head.twig' %} + + {% block css %}{% endblock %} @@ -17,11 +19,7 @@ {% include 'counters.twig' %} - - - {% block js %} - {# extra js scripts here #} - {% endblock %} - + + {% block js %}{% endblock %} diff --git a/source/about/me.html.twig b/source/about/me.html.twig index 616cdc3..f9c3c5f 100644 --- a/source/about/me.html.twig +++ b/source/about/me.html.twig @@ -5,11 +5,13 @@ description: Несколько фактов об авторе --- {% block js %} - + +{% endblock %} + +{% block css %} + {% endblock %} {% block content %} -
- {% endblock %} diff --git a/source/projects/predictor/index.html.twig b/source/projects/predictor/index.html.twig index b5c13f5..317cc08 100644 --- a/source/projects/predictor/index.html.twig +++ b/source/projects/predictor/index.html.twig @@ -5,7 +5,11 @@ description: Демо-версия электронной гадалки Шен --- {% block js %} - + +{% endblock %} + +{% block css %} + {% endblock %} {% block content %} diff --git a/webpack.config.js b/webpack.config.js index b8658d3..e5246b0 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -1,6 +1,7 @@ const path = require('path'); const autoprefixer = require('autoprefixer'); const VueLoaderPlugin = require('vue-loader/lib/plugin'); +const MiniCssExtractPlugin = require('mini-css-extract-plugin'); module.exports = (env = {}) => { const is_prod = !!env.production; @@ -28,6 +29,8 @@ module.exports = (env = {}) => { const SCSS_LOADER = { loader: 'sass-loader' }; + const MINI_CSS_LOADER = MiniCssExtractPlugin.loader; + const BABEL_LOADER = { loader: 'babel-loader', options: { @@ -39,9 +42,13 @@ module.exports = (env = {}) => { loader: 'vue-loader', options: { loaders: { - css: ['vue-style-loader', CSS_LOADER, POSTCSS_LOADER], + css: [ + MINI_CSS_LOADER, //'vue-style-loader', + CSS_LOADER, + POSTCSS_LOADER, + ], scss: [ - 'vue-style-loader', + MINI_CSS_LOADER, //'vue-style-loader', CSS_LOADER, POSTCSS_LOADER, 'sass-loader', @@ -71,12 +78,18 @@ module.exports = (env = {}) => { }, { test: /\.css$/, - use: [STYLE_LOADER, CSS_LOADER, POSTCSS_LOADER], + use: [ + MINI_CSS_LOADER, + // STYLE_LOADER, + CSS_LOADER, + POSTCSS_LOADER, + ], }, { test: /\.scss$/, use: [ - STYLE_LOADER, + MINI_CSS_LOADER, + // STYLE_LOADER, CSS_LOADER, POSTCSS_LOADER, SCSS_LOADER, @@ -88,6 +101,14 @@ module.exports = (env = {}) => { }, ], }, - plugins: [new VueLoaderPlugin()], + plugins: [ + new VueLoaderPlugin(), + new MiniCssExtractPlugin({ + // Options similar to the same options in webpackOptions.output + // both options are optional + filename: '[name].css', + // chunkFilename: "[id].css" + }), + ], }; };