Extract CSS from webpack js
This commit is contained in:
parent
f116cc07f2
commit
06a053fb10
|
@ -17,7 +17,9 @@
|
||||||
"html-loader": "^0.5.5",
|
"html-loader": "^0.5.5",
|
||||||
"html-webpack-plugin": "^3.1.0",
|
"html-webpack-plugin": "^3.1.0",
|
||||||
"jstransformer-markdown-it": "^2.0.0",
|
"jstransformer-markdown-it": "^2.0.0",
|
||||||
|
"mini-css-extract-plugin": "^0.4.0",
|
||||||
"node-sass": "^4.8.3",
|
"node-sass": "^4.8.3",
|
||||||
|
"optimize-css-assets-webpack-plugin": "^4.0.0",
|
||||||
"postcss-loader": "^2.1.3",
|
"postcss-loader": "^2.1.3",
|
||||||
"precss": "^3.1.2",
|
"precss": "^3.1.2",
|
||||||
"pug": "^2.0.3",
|
"pug": "^2.0.3",
|
||||||
|
|
|
@ -3,6 +3,7 @@ const path = require("path");
|
||||||
const webpack = require("webpack");
|
const webpack = require("webpack");
|
||||||
const HtmlWebpackPlugin = require("html-webpack-plugin");
|
const HtmlWebpackPlugin = require("html-webpack-plugin");
|
||||||
const CleanWebpackPlugin = require("clean-webpack-plugin");
|
const CleanWebpackPlugin = require("clean-webpack-plugin");
|
||||||
|
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
|
||||||
|
|
||||||
const PAGE_DIR = path.resolve(__dirname, "src", "pages");
|
const PAGE_DIR = path.resolve(__dirname, "src", "pages");
|
||||||
|
|
||||||
|
@ -28,7 +29,8 @@ module.exports = {
|
||||||
new webpack.ProvidePlugin({
|
new webpack.ProvidePlugin({
|
||||||
$: "jquery",
|
$: "jquery",
|
||||||
jQuery: "jquery"
|
jQuery: "jquery"
|
||||||
})
|
}),
|
||||||
|
new MiniCssExtractPlugin()
|
||||||
].concat(pages.map(page => new HtmlWebpackPlugin(page))),
|
].concat(pages.map(page => new HtmlWebpackPlugin(page))),
|
||||||
module: {
|
module: {
|
||||||
rules: [
|
rules: [
|
||||||
|
@ -45,7 +47,7 @@ module.exports = {
|
||||||
{
|
{
|
||||||
test: /.scss$/,
|
test: /.scss$/,
|
||||||
use: [{
|
use: [{
|
||||||
loader: "style-loader"
|
loader: MiniCssExtractPlugin.loader
|
||||||
}, {
|
}, {
|
||||||
loader: "css-loader"
|
loader: "css-loader"
|
||||||
}, {
|
}, {
|
||||||
|
|
|
@ -1,7 +1,19 @@
|
||||||
const merge = require("webpack-merge");
|
const merge = require("webpack-merge");
|
||||||
const common = require("./webpack.common.js");
|
const common = require("./webpack.common.js");
|
||||||
|
const UglifyJsPlugin = require("uglifyjs-webpack-plugin");
|
||||||
|
const OptimizeCSSAssetsPlugin = require("optimize-css-assets-webpack-plugin");
|
||||||
|
|
||||||
module.exports = merge(common, {
|
module.exports = merge(common, {
|
||||||
|
optimization: {
|
||||||
|
minimizer: [
|
||||||
|
new UglifyJsPlugin({
|
||||||
|
cache: true,
|
||||||
|
parallel: true,
|
||||||
|
sourceMap: true
|
||||||
|
}),
|
||||||
|
new OptimizeCSSAssetsPlugin({})
|
||||||
|
]
|
||||||
|
},
|
||||||
devtool: "source-map",
|
devtool: "source-map",
|
||||||
mode: "production"
|
mode: "production"
|
||||||
});
|
});
|
||||||
|
|
23
yarn.lock
23
yarn.lock
|
@ -1761,7 +1761,7 @@ cssesc@^0.1.0:
|
||||||
version "0.1.0"
|
version "0.1.0"
|
||||||
resolved "https://registry.yarnpkg.com/cssesc/-/cssesc-0.1.0.tgz#c814903e45623371a0477b40109aaafbeeaddbb4"
|
resolved "https://registry.yarnpkg.com/cssesc/-/cssesc-0.1.0.tgz#c814903e45623371a0477b40109aaafbeeaddbb4"
|
||||||
|
|
||||||
cssnano@^3.10.0:
|
cssnano@^3.10.0, cssnano@^3.4.0:
|
||||||
version "3.10.0"
|
version "3.10.0"
|
||||||
resolved "https://registry.yarnpkg.com/cssnano/-/cssnano-3.10.0.tgz#4f38f6cea2b9b17fa01490f23f1dc68ea65c1c38"
|
resolved "https://registry.yarnpkg.com/cssnano/-/cssnano-3.10.0.tgz#4f38f6cea2b9b17fa01490f23f1dc68ea65c1c38"
|
||||||
dependencies:
|
dependencies:
|
||||||
|
@ -3499,6 +3499,13 @@ kind-of@^6.0.0, kind-of@^6.0.2:
|
||||||
version "6.0.2"
|
version "6.0.2"
|
||||||
resolved "https://registry.yarnpkg.com/kind-of/-/kind-of-6.0.2.tgz#01146b36a6218e64e58f3a8d66de5d7fc6f6d051"
|
resolved "https://registry.yarnpkg.com/kind-of/-/kind-of-6.0.2.tgz#01146b36a6218e64e58f3a8d66de5d7fc6f6d051"
|
||||||
|
|
||||||
|
last-call-webpack-plugin@^3.0.0:
|
||||||
|
version "3.0.0"
|
||||||
|
resolved "https://registry.yarnpkg.com/last-call-webpack-plugin/-/last-call-webpack-plugin-3.0.0.tgz#9742df0e10e3cf46e5c0381c2de90d3a7a2d7555"
|
||||||
|
dependencies:
|
||||||
|
lodash "^4.17.5"
|
||||||
|
webpack-sources "^1.1.0"
|
||||||
|
|
||||||
lazy-cache@^1.0.3:
|
lazy-cache@^1.0.3:
|
||||||
version "1.0.4"
|
version "1.0.4"
|
||||||
resolved "https://registry.yarnpkg.com/lazy-cache/-/lazy-cache-1.0.4.tgz#a1d78fc3a50474cb80845d3b3b6e1da49a446e8e"
|
resolved "https://registry.yarnpkg.com/lazy-cache/-/lazy-cache-1.0.4.tgz#a1d78fc3a50474cb80845d3b3b6e1da49a446e8e"
|
||||||
|
@ -3875,6 +3882,13 @@ mimic-response@^1.0.0:
|
||||||
version "1.0.0"
|
version "1.0.0"
|
||||||
resolved "https://registry.yarnpkg.com/mimic-response/-/mimic-response-1.0.0.tgz#df3d3652a73fded6b9b0b24146e6fd052353458e"
|
resolved "https://registry.yarnpkg.com/mimic-response/-/mimic-response-1.0.0.tgz#df3d3652a73fded6b9b0b24146e6fd052353458e"
|
||||||
|
|
||||||
|
mini-css-extract-plugin@^0.4.0:
|
||||||
|
version "0.4.0"
|
||||||
|
resolved "https://registry.yarnpkg.com/mini-css-extract-plugin/-/mini-css-extract-plugin-0.4.0.tgz#ff3bf08bee96e618e177c16ca6131bfecef707f9"
|
||||||
|
dependencies:
|
||||||
|
loader-utils "^1.1.0"
|
||||||
|
webpack-sources "^1.1.0"
|
||||||
|
|
||||||
minimalistic-assert@^1.0.0:
|
minimalistic-assert@^1.0.0:
|
||||||
version "1.0.0"
|
version "1.0.0"
|
||||||
resolved "https://registry.yarnpkg.com/minimalistic-assert/-/minimalistic-assert-1.0.0.tgz#702be2dda6b37f4836bcb3f5db56641b64a1d3d3"
|
resolved "https://registry.yarnpkg.com/minimalistic-assert/-/minimalistic-assert-1.0.0.tgz#702be2dda6b37f4836bcb3f5db56641b64a1d3d3"
|
||||||
|
@ -4236,6 +4250,13 @@ onetime@^2.0.0:
|
||||||
dependencies:
|
dependencies:
|
||||||
mimic-fn "^1.0.0"
|
mimic-fn "^1.0.0"
|
||||||
|
|
||||||
|
optimize-css-assets-webpack-plugin@^4.0.0:
|
||||||
|
version "4.0.0"
|
||||||
|
resolved "https://registry.yarnpkg.com/optimize-css-assets-webpack-plugin/-/optimize-css-assets-webpack-plugin-4.0.0.tgz#d5f80041fb1391b358a1f35273c3b53de814e8fe"
|
||||||
|
dependencies:
|
||||||
|
cssnano "^3.4.0"
|
||||||
|
last-call-webpack-plugin "^3.0.0"
|
||||||
|
|
||||||
ora@^0.2.3:
|
ora@^0.2.3:
|
||||||
version "0.2.3"
|
version "0.2.3"
|
||||||
resolved "https://registry.yarnpkg.com/ora/-/ora-0.2.3.tgz#37527d220adcd53c39b73571d754156d5db657a4"
|
resolved "https://registry.yarnpkg.com/ora/-/ora-0.2.3.tgz#37527d220adcd53c39b73571d754156d5db657a4"
|
||||||
|
|
Reference in a new issue