aboutsummaryrefslogtreecommitdiffhomepage
path: root/webpack.config.js
diff options
context:
space:
mode:
authorArthurHoaro <arthur@hoa.ro>2018-03-28 19:08:06 +0200
committerGitHub <noreply@github.com>2018-03-28 19:08:06 +0200
commitc81f1afc0a3a16daf98741a63c7524b27835da99 (patch)
treedfe81b73f028dfc27eda916b14bf4bc17966b082 /webpack.config.js
parent9b2bd66fb60ffd5a833480bf329062c7d57bc8c4 (diff)
parentd7eb06bd7c4d01bbdf67f4f100af7a3e300098d3 (diff)
downloadShaarli-c81f1afc0a3a16daf98741a63c7524b27835da99.tar.gz
Shaarli-c81f1afc0a3a16daf98741a63c7524b27835da99.tar.zst
Shaarli-c81f1afc0a3a16daf98741a63c7524b27835da99.zip
Merge pull request #1072 from ArthurHoaro/feature/modern-front-end
Manage frontend dependencies with npm/yarn and webpack
Diffstat (limited to 'webpack.config.js')
-rw-r--r--webpack.config.js149
1 files changed, 149 insertions, 0 deletions
diff --git a/webpack.config.js b/webpack.config.js
new file mode 100644
index 00000000..94b7aa70
--- /dev/null
+++ b/webpack.config.js
@@ -0,0 +1,149 @@
1const path = require('path');
2const glob = require('glob');
3
4// Minify JS
5const MinifyPlugin = require('babel-minify-webpack-plugin');
6
7// This plugin extracts the CSS into its own file instead of tying it with the JS.
8// It prevents:
9// - not having styles due to a JS error
10// - the flash page without styles during JS loading
11const ExtractTextPlugin = require("extract-text-webpack-plugin");
12
13const extractCssDefault = new ExtractTextPlugin({
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});
22
23module.exports = [
24 {
25 entry: {
26 picwall: './assets/common/js/picwall.js',
27 pluginsadmin: './assets/default/js/plugins-admin.js',
28 shaarli: [
29 './assets/default/js/base.js',
30 './assets/default/scss/shaarli.scss',
31 ].concat(glob.sync('./assets/default/img/*')),
32 },
33 output: {
34 filename: '[name].min.js',
35 path: path.resolve(__dirname, 'tpl/default/js/')
36 },
37 module: {
38 rules: [
39 {
40 test: /\.js$/,
41 exclude: /node_modules/,
42 use: {
43 loader: 'babel-loader',
44 options: {
45 presets: [
46 'babel-preset-env',
47 ]
48 }
49 }
50 },
51 {
52 test: /\.scss/,
53 use: extractCssDefault.extract({
54 use: [{
55 loader: "css-loader",
56 options: {
57 minimize: true,
58 }
59 }, {
60 loader: "sass-loader"
61 }],
62 })
63 },
64 {
65 test: /\.(gif|png|jpe?g|svg|ico)$/i,
66 use: [
67 {
68 loader: 'file-loader',
69 options: {
70 name: '../img/[name].[ext]',
71 publicPath: 'tpl/default/img/',
72 }
73 }
74 ],
75 },
76 {
77 test: /\.(eot|ttf|woff|woff2)(\?v=[0-9]\.[0-9]\.[0-9])?$/,
78 loader: 'file-loader',
79 options: {
80 name: '../fonts/[name].[ext]',
81 // do not add a publicPath here because it's already handled by CSS's publicPath
82 publicPath: '',
83 }
84 },
85 ],
86 },
87 plugins: [
88 new MinifyPlugin(),
89 extractCssDefault,
90 ],
91 },
92 {
93 entry: {
94 shaarli: [
95 './assets/vintage/js/base.js',
96 './assets/vintage/css/reset.css',
97 './assets/vintage/css/shaarli.css',
98 ].concat(glob.sync('./assets/vintage/img/*')),
99 picwall: './assets/common/js/picwall.js',
100 },
101 output: {
102 filename: '[name].min.js',
103 path: path.resolve(__dirname, 'tpl/vintage/js/')
104 },
105 module: {
106 rules: [
107 {
108 test: /\.js$/,
109 exclude: /node_modules/,
110 use: {
111 loader: 'babel-loader',
112 options: {
113 presets: [
114 'babel-preset-env',
115 ]
116 }
117 }
118 },
119 {
120 test: /\.css$/,
121 use: extractCssVintage.extract({
122 use: [{
123 loader: "css-loader",
124 options: {
125 minimize: true,
126 }
127 }],
128 })
129 },
130 {
131 test: /\.(gif|png|jpe?g|svg|ico)$/i,
132 use: [
133 {
134 loader: 'file-loader',
135 options: {
136 name: '../img/[name].[ext]',
137 publicPath: '',
138 }
139 }
140 ],
141 },
142 ],
143 },
144 plugins: [
145 new MinifyPlugin(),
146 extractCssVintage,
147 ],
148 },
149];