aboutsummaryrefslogtreecommitdiffhomepage
path: root/webpack.config.js
diff options
context:
space:
mode:
Diffstat (limited to 'webpack.config.js')
-rw-r--r--webpack.config.js68
1 files changed, 36 insertions, 32 deletions
diff --git a/webpack.config.js b/webpack.config.js
index 602147e5..a73758cc 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -2,26 +2,21 @@ const path = require('path');
2const glob = require('glob'); 2const glob = require('glob');
3 3
4// Minify JS 4// Minify JS
5const MinifyPlugin = require('babel-minify-webpack-plugin'); 5const TerserPlugin = require('terser-webpack-plugin');
6 6
7// This plugin extracts the CSS into its own file instead of tying it with the JS. 7// This plugin extracts the CSS into its own file instead of tying it with the JS.
8// It prevents: 8// It prevents:
9// - not having styles due to a JS error 9// - not having styles due to a JS error
10// - the flash page without styles during JS loading 10// - the flash page without styles during JS loading
11const ExtractTextPlugin = require("extract-text-webpack-plugin"); 11const MiniCssExtractPlugin = require("mini-css-extract-plugin");
12 12
13const extractCssDefault = new ExtractTextPlugin({ 13const extractCss = new MiniCssExtractPlugin({
14 filename: "../css/[name].min.css", 14 filename: "../css/[name].min.css",
15 publicPath: 'tpl/default/css/',
16});
17
18const extractCssVintage = new ExtractTextPlugin({
19 filename: "../css/[name].min.css",
20 publicPath: 'tpl/vintage/css/',
21}); 15});
22 16
23module.exports = [ 17module.exports = [
24 { 18 {
19 mode: 'production',
25 entry: { 20 entry: {
26 thumbnails: './assets/common/js/thumbnails.js', 21 thumbnails: './assets/common/js/thumbnails.js',
27 thumbnails_update: './assets/common/js/thumbnails-update.js', 22 thumbnails_update: './assets/common/js/thumbnails-update.js',
@@ -45,23 +40,23 @@ module.exports = [
45 loader: 'babel-loader', 40 loader: 'babel-loader',
46 options: { 41 options: {
47 presets: [ 42 presets: [
48 'babel-preset-env', 43 '@babel/preset-env',
49 ] 44 ]
50 } 45 }
51 } 46 }
52 }, 47 },
53 { 48 {
54 test: /\.s?css/, 49 test: /\.s?css/,
55 use: extractCssDefault.extract({ 50 use: [
56 use: [{ 51 {
57 loader: "css-loader", 52 loader: MiniCssExtractPlugin.loader,
58 options: { 53 options: {
59 minimize: true, 54 publicPath: 'tpl/default/css/',
60 } 55 },
61 }, { 56 },
62 loader: "sass-loader" 57 'css-loader',
63 }], 58 'sass-loader',
64 }) 59 ],
65 }, 60 },
66 { 61 {
67 test: /\.(gif|png|jpe?g|svg|ico)$/i, 62 test: /\.(gif|png|jpe?g|svg|ico)$/i,
@@ -81,17 +76,21 @@ module.exports = [
81 options: { 76 options: {
82 name: '../fonts/[name].[ext]', 77 name: '../fonts/[name].[ext]',
83 // do not add a publicPath here because it's already handled by CSS's publicPath 78 // do not add a publicPath here because it's already handled by CSS's publicPath
84 publicPath: '', 79 publicPath: '../default/',
85 } 80 }
86 }, 81 },
87 ], 82 ],
88 }, 83 },
84 optimization: {
85 minimize: true,
86 minimizer: [new TerserPlugin()],
87 },
89 plugins: [ 88 plugins: [
90 new MinifyPlugin(), 89 extractCss,
91 extractCssDefault,
92 ], 90 ],
93 }, 91 },
94 { 92 {
93 mode: 'production',
95 entry: { 94 entry: {
96 shaarli: [ 95 shaarli: [
97 './assets/vintage/js/base.js', 96 './assets/vintage/js/base.js',
@@ -115,21 +114,23 @@ module.exports = [
115 loader: 'babel-loader', 114 loader: 'babel-loader',
116 options: { 115 options: {
117 presets: [ 116 presets: [
118 'babel-preset-env', 117 '@babel/preset-env',
119 ] 118 ]
120 } 119 }
121 } 120 }
122 }, 121 },
123 { 122 {
124 test: /\.css$/, 123 test: /\.css$/,
125 use: extractCssVintage.extract({ 124 use: [
126 use: [{ 125 {
127 loader: "css-loader", 126 loader: MiniCssExtractPlugin.loader,
128 options: { 127 options: {
129 minimize: true, 128 publicPath: 'tpl/vintage/css/',
130 } 129 },
131 }], 130 },
132 }) 131 'css-loader',
132 'sass-loader',
133 ],
133 }, 134 },
134 { 135 {
135 test: /\.(gif|png|jpe?g|svg|ico)$/i, 136 test: /\.(gif|png|jpe?g|svg|ico)$/i,
@@ -145,9 +146,12 @@ module.exports = [
145 }, 146 },
146 ], 147 ],
147 }, 148 },
149 optimization: {
150 minimize: true,
151 minimizer: [new TerserPlugin()],
152 },
148 plugins: [ 153 plugins: [
149 new MinifyPlugin(), 154 extractCss,
150 extractCssVintage,
151 ], 155 ],
152 }, 156 },
153]; 157];