1 var path = require('path') |
1 const path = require('path') |
2 var webpack = require('webpack') |
2 const webpack = require('webpack') |
3 var ExtractTextPlugin = require("extract-text-webpack-plugin") |
3 const ExtractTextPlugin = require('extract-text-webpack-plugin') |
4 var projectRoot = path.resolve(__dirname) |
4 const UglifyJsPlugin = require('uglifyjs-webpack-plugin') |
|
5 const projectRoot = path.resolve(__dirname) |
|
6 const VueLoaderPlugin = require('vue-loader/lib/plugin') |
|
7 const LodashModuleReplacementPlugin = require('lodash-webpack-plugin') |
|
8 const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin |
|
9 |
|
10 const cssLoaders = [{ |
|
11 loader: 'css-loader', |
|
12 options: { |
|
13 module: true, |
|
14 localIdentName: '[local]' |
|
15 } |
|
16 }] |
|
17 |
|
18 const scssLoaders = [ |
|
19 { |
|
20 loader: 'css-loader', |
|
21 options: { |
|
22 module: true, |
|
23 localIdentName: '[local]', |
|
24 importLoaders: 1 |
|
25 } |
|
26 }, |
|
27 { |
|
28 loader: 'resolve-url-loader' |
|
29 }, |
|
30 { |
|
31 loader: 'postcss-loader' |
|
32 }, |
|
33 { |
|
34 loader: 'sass-loader' |
|
35 } |
|
36 ] |
5 |
37 |
6 module.exports = { |
38 module.exports = { |
7 entry: { |
39 entry: { |
8 vendor: [ |
40 vendor: [ |
9 'jquery', |
41 'jquery', |
10 'bootstrap', |
42 'bootstrap' |
11 ], |
43 ], |
12 iconolab: [ |
44 iconolab: [ |
13 './src/main.js', |
45 './src/main.js', |
14 './src/main.scss', |
46 './src/main.scss' |
15 ] |
47 ] |
16 }, |
48 }, |
17 output: { |
49 output: { |
18 path: __dirname + '/../../src/iconolab/static', |
50 path: path.join(__dirname, '/../../src/iconolab/static'), |
19 publicPath: '/static/', |
51 publicPath: '/static/', |
20 filename: 'iconolab/js/[name].js' |
52 filename: 'iconolab/js/[name].js' |
21 }, |
53 }, |
22 module: { |
54 module: { |
23 loaders: [ |
55 rules: [{ |
24 { |
56 test: /\.vue$/, |
25 test: /\.vue$/, |
57 loader: 'vue-loader' |
26 loader: 'vue' |
58 }, |
27 }, |
59 { |
28 { |
60 test: /\.css$/, |
29 test: /\.css$/, |
61 loader: ExtractTextPlugin.extract({ |
30 loader: ExtractTextPlugin.extract("style-loader", "css-loader?modules&localIdentName=[local]"), |
62 fallback: 'style-loader', |
31 include: [ |
63 use: cssLoaders |
32 __dirname + '/src', |
64 }), |
33 /node_modules/ |
65 include: [ |
34 ] |
66 path.join(__dirname, '/src'), |
35 }, |
67 /node_modules/ |
36 { |
68 ] |
37 test: /\.scss$/, |
69 }, |
38 loader: ExtractTextPlugin.extract("style-loader", "css-loader?modules&importLoaders=1&localIdentName=[local]!resolve-url-loader!postcss-loader!sass-loader"), |
70 { |
39 include: [ |
71 test: /\.scss$/, |
40 __dirname + '/src', |
72 loader: ExtractTextPlugin.extract({ |
41 /node_modules/ |
73 fallback: 'style-loader', |
42 ] |
74 use: scssLoaders |
43 }, |
75 }), |
44 { |
76 include: [ |
45 test: /\.js$/, |
77 path.join(__dirname, '/src'), |
|
78 /node_modules/ |
|
79 ] |
|
80 }, |
|
81 { |
|
82 test: /\.js$/, |
|
83 use: [{ |
46 loader: 'babel-loader', |
84 loader: 'babel-loader', |
47 exclude: /node_modules/, |
85 options: { |
48 include: [ |
86 presets: ['es2015'], |
49 path.join(projectRoot, 'src') |
87 plugins: ['transform-es2015-shorthand-properties', 'lodash'] |
50 ], |
|
51 query: { |
|
52 presets: ['es2015'] |
|
53 }, |
|
54 "plugins": ["transform-es2015-shorthand-properties"] |
|
55 }, |
|
56 { |
|
57 test: /\.(png|jpg|gif|svg)$/, |
|
58 loader: 'file', |
|
59 query: { |
|
60 name: '[name].[ext]?[hash]' |
|
61 } |
88 } |
62 }, |
89 }], |
63 { |
90 exclude: /node_modules/, |
64 test: /\.(ttf|eot|svg|woff|woff2)(\?v=[0-9]\.[0-9]\.[0-9])?$/, |
91 include: [ |
65 loader: 'file-loader?name=[name].[ext]&publicPath=../fonts/&outputPath=iconolab/fonts/' |
92 path.join(projectRoot, 'src') |
66 }, |
93 ] |
67 { |
94 }, |
68 test: require.resolve('snapsvg'), |
95 { |
69 loader: 'imports-loader?this=>window,fix=>module.exports=0' |
96 test: /\.(png|jpg|gif|svg)$/, |
70 }, |
97 loader: 'file-loader', |
71 ] |
98 query: { |
72 }, |
99 name: '[name].[ext]?[hash]' |
|
100 } |
|
101 }, |
|
102 { |
|
103 test: /\.(ttf|eot|svg|woff|woff2)(\?v=[0-9]\.[0-9]\.[0-9])?$/, |
|
104 loader: 'file-loader?name=[name].[ext]&publicPath=../fonts/&outputPath=iconolab/fonts/' |
|
105 }, |
|
106 { |
|
107 test: require.resolve('snapsvg'), |
|
108 loader: 'imports-loader?this=>window,fix=>module.exports=0' |
|
109 }, |
|
110 { |
|
111 test: require.resolve('jquery'), |
|
112 use: [{ |
|
113 loader: 'expose-loader', |
|
114 options: 'JQuery' |
|
115 }, { |
|
116 loader: 'expose-loader', |
|
117 options: '$' |
|
118 }] |
|
119 }, |
|
120 { |
|
121 test: require.resolve('vue/dist/vue.min'), |
|
122 use: [{ |
|
123 loader: 'expose-loader', |
|
124 options: 'Vue' |
|
125 }] |
|
126 } |
|
127 ]}, |
73 plugins: [ |
128 plugins: [ |
74 new webpack.optimize.CommonsChunkPlugin({ |
129 new ExtractTextPlugin('iconolab/css/[name].css'), |
75 name: 'vendor' |
130 new VueLoaderPlugin(), |
|
131 new webpack.ProvidePlugin({ |
|
132 $: 'jquery', |
|
133 jQuery: 'jquery', |
|
134 Popper: ['popper.js', 'default'] |
76 }), |
135 }), |
77 new ExtractTextPlugin("iconolab/css/[name].css"), |
136 new LodashModuleReplacementPlugin(), |
78 new webpack.ProvidePlugin({ |
137 new webpack.ContextReplacementPlugin(/moment[\/\\]locale$/, /fr/) |
79 $: "jquery", |
|
80 jQuery: "jquery", |
|
81 _: "lodash" |
|
82 }) |
|
83 ], |
138 ], |
84 devServer: { |
139 devServer: { |
85 port: 8001, |
140 port: 8001, |
86 contentBase: __dirname + '/../../src/iconolab', |
141 contentBase: path.join(__dirname, '/../../src/iconolab'), |
87 publicPath: '/static/', |
142 publicPath: '/static/', |
88 stats: 'minimal', |
143 stats: 'minimal', |
89 compress: true, |
144 compress: true, |
90 headers: { 'Access-Control-Allow-Origin': '*' }, |
145 headers: { |
91 historyApiFallback: true, |
146 'Access-Control-Allow-Origin': '*' |
|
147 }, |
|
148 historyApiFallback: true |
92 }, |
149 }, |
93 devtool: '#source-map' |
150 devtool: '#source-map', |
|
151 performance: { hints: false }, |
|
152 optimization: { |
|
153 splitChunks: { // CommonsChunkPlugin() |
|
154 name: 'vendor' |
|
155 }, |
|
156 minimizer: [ |
|
157 new UglifyJsPlugin({ |
|
158 uglifyOptions: { |
|
159 ie8: false, |
|
160 mangle: true, |
|
161 output: { |
|
162 comments: false, |
|
163 beautify: false |
|
164 }, |
|
165 compress: true, |
|
166 warnings: false, |
|
167 ecma: 6 |
|
168 }, |
|
169 sourceMap: true |
|
170 }) |
|
171 ] |
|
172 } |
94 } |
173 } |
95 |
174 |
96 if (process.env.NODE_ENV === 'production') { |
175 if (process.env.NODE_ENV === 'production') { |
97 module.exports.devtool = '#source-map' |
176 module.exports.mode = 'production' |
|
177 module.exports.devtool = false |
98 // http://vue-loader.vuejs.org/en/workflow/production.html |
178 // http://vue-loader.vuejs.org/en/workflow/production.html |
99 module.exports.plugins = (module.exports.plugins || []).concat([ |
179 module.exports.plugins = (module.exports.plugins || []).concat([ |
100 new webpack.DefinePlugin({ |
180 new webpack.DefinePlugin({ |
101 'process.env': { |
181 'process.env': { |
102 NODE_ENV: '"production"' |
182 'NODE_ENV': '"production"' |
103 } |
183 } |
104 }), |
184 }) |
105 new webpack.optimize.UglifyJsPlugin({ |
185 ]) |
106 compress: { |
186 } else { |
107 warnings: false |
187 module.exports.mode = 'development' |
108 } |
188 module.exports.plugins = (module.exports.plugins || []).concat([ |
109 }), |
189 new BundleAnalyzerPlugin() |
110 new webpack.optimize.OccurenceOrderPlugin() |
|
111 ]) |
190 ]) |
112 } |
191 } |