1
1
import webpack from 'webpack'
2
- import CopyWebpackPlugin from 'copy-webpack-plugin'
2
+ import CopyPlugin from 'copy-webpack-plugin'
3
3
import ExtractTextPlugin from 'extract-text-webpack-plugin'
4
4
import HtmlWebpackPlugin from 'html-webpack-plugin'
5
- import SWPrecacheWebpackPlugin from 'sw-precache-webpack-plugin'
5
+ import SWPrecachePlugin from 'sw-precache-webpack-plugin'
6
6
import _debug from 'debug'
7
7
import pug from 'pug'
8
8
9
- import config , { globals , paths , pkg } from '../config'
10
- import utils , { baseLoaders , cssModuleLoaders , generateLoaders , nodeModules } from './utils'
11
- const { NODE_ENV , __DEV__ , __PROD__ , __TESTING__ , __MOCK__ } = globals
9
+ import config , { globals , paths } from '../config'
10
+ import {
11
+ commonCssLoaders ,
12
+ cssModuleOptions ,
13
+ baseLoaders ,
14
+ cssModuleLoaders ,
15
+ generateLoaders ,
16
+ nodeModules ,
17
+ vueCssLoaders
18
+ } from './utils'
19
+
20
+ const { NODE_ENV , __DEV__ , __TEST__ , __TESTING__ , __PROD__ , __MOCK__ } = globals
12
21
13
22
const debug = _debug ( 'hi:webpack:config' )
14
23
@@ -17,7 +26,7 @@ const webpackConfig = {
17
26
target : 'web' ,
18
27
resolve : {
19
28
modules : [ paths . src ( ) , paths . base ( 'packages' ) , 'node_modules' ] ,
20
- extensions : [ '.js' , '.styl' , '.pug' ] ,
29
+ extensions : [ '.vue' , '. js', '.styl' , '.pug' ] ,
21
30
enforceExtension : false ,
22
31
enforceModuleExtension : false ,
23
32
alias : config . compiler_alias
@@ -39,11 +48,11 @@ const webpackConfig = {
39
48
// ------------------------------------
40
49
// Entry Points
41
50
// ------------------------------------
42
- const APP_ENTRY_PATH = paths . src ( 'index.js' )
51
+ const APP_ENTRY_PATH = [ 'regenerator-runtime/runtime' , paths . src ( 'index.js' ) ]
43
52
44
53
webpackConfig . entry = {
45
54
app : __DEV__
46
- ? [ APP_ENTRY_PATH , 'webpack-hot-middleware/client' ]
55
+ ? [ ... APP_ENTRY_PATH , 'webpack-hot-middleware/client' ]
47
56
: APP_ENTRY_PATH ,
48
57
vendor : config . compiler_vendor
49
58
}
@@ -52,40 +61,41 @@ webpackConfig.entry = {
52
61
// Bundle Output
53
62
// ------------------------------------
54
63
64
+ const prodEmpty = str => __PROD__ ? '' : str
65
+
55
66
webpackConfig . output = {
56
67
path : paths . dist ( ) ,
57
68
publicPath : config . compiler_public_path ,
58
- filename : `[name].[${ config . compiler_hash_type } ].js` ,
59
- chunkFilename : `[id].[${ config . compiler_hash_type } ].js`
69
+ filename : `${ prodEmpty ( ' [name].' ) } [${ config . compiler_hash_type } ].js` ,
70
+ chunkFilename : `${ prodEmpty ( ' [id].' ) } [${ config . compiler_hash_type } ].js`
60
71
}
61
72
62
73
// ------------------------------------
63
74
// Loaders
64
75
// ------------------------------------
65
76
66
77
const sourceMap = ! ! config . compiler_devtool
67
- const STYLUS_LOADER = 'stylus-loader?paths=node_modules/bootstrap-styl/ '
78
+ const STYLUS_LOADER = 'stylus-loader'
68
79
let appLoader , bootstrapLoader
69
80
81
+ const extracting = __TEST__ || __PROD__
82
+
83
+ const IMG_LOADER = __DEV__ ? '' : '!img-loader?minimize&progressive=true'
84
+
70
85
webpackConfig . module . rules = [
71
- ...utils . commonCssLoaders ( {
86
+ ...commonCssLoaders ( {
72
87
sourceMap,
73
- exclude : [ 'styl' ]
74
- } ) ,
75
- ...__TESTING__ ? [ {
76
- test : / \. s t y l $ / ,
77
- loader : generateLoaders ( STYLUS_LOADER , baseLoaders ) ,
78
- exclude : nodeModules
79
- } ] : [ {
88
+ exclude : [ 'styl' , 'stylus' ]
89
+ } ) , {
80
90
test : / [ / \\ ] a p p \. s t y l $ / ,
81
91
loader : generateLoaders ( STYLUS_LOADER , baseLoaders , {
82
- extract : ! __DEV__ && ( appLoader = new ExtractTextPlugin ( 'app.[contenthash].css' ) )
92
+ extract : extracting && ( appLoader = new ExtractTextPlugin ( ` ${ prodEmpty ( 'app.' ) } [contenthash].css` ) )
83
93
} ) ,
84
94
exclude : nodeModules
85
95
} , {
86
96
test : / [ / \\ ] b o o t s t r a p \. s t y l $ / ,
87
97
loader : generateLoaders ( STYLUS_LOADER , baseLoaders , {
88
- extract : ! __DEV__ && ( bootstrapLoader = new ExtractTextPlugin ( 'bootstrap.[contenthash].css' ) )
98
+ extract : extracting && ( bootstrapLoader = new ExtractTextPlugin ( ` ${ prodEmpty ( 'bootstrap.' ) } [contenthash].css` ) )
89
99
} ) ,
90
100
exclude : nodeModules
91
101
} , {
@@ -96,28 +106,38 @@ webpackConfig.module.rules = [
96
106
test : / ^ (? ! .* [ / \\ ] ( a p p | b o o t s t r a p | t h e m e - \w + ) \. s t y l $ ) .* \. s t y l $ / ,
97
107
loader : generateLoaders ( STYLUS_LOADER , cssModuleLoaders ) ,
98
108
exclude : nodeModules
99
- } ] , {
109
+ } , {
100
110
test : / \. s t y l $ / ,
101
111
loader : generateLoaders ( STYLUS_LOADER , baseLoaders ) ,
102
112
include : nodeModules
113
+ } , {
114
+ test : / \. s t y l u s $ / ,
115
+ loader : generateLoaders ( STYLUS_LOADER , baseLoaders , { style : false } )
103
116
} , {
104
117
test : / \. j s $ / ,
105
118
loader : 'babel-loader?cacheDirectory' ,
106
119
exclude : nodeModules
120
+ } , {
121
+ test : / \. v u e $ / ,
122
+ loader : 'vue-loader' ,
123
+ options : {
124
+ ...vueCssLoaders ( ) ,
125
+ cssModules : cssModuleOptions
126
+ }
107
127
} , {
108
128
test : / \. p u g $ / ,
109
129
loader : `vue-template-es2015-loader!template-file-loader?raw&pretty=${ __DEV__ } &doctype=html` ,
110
130
exclude : nodeModules
111
131
} , {
112
132
test : / \. ( p n g | j p e ? g | g i f ) $ / ,
113
- loader : ' url-loader?limit=10000&name=[name].[hash].[ext]!img-loader?minimize&progressive=true'
133
+ loader : ` url-loader?limit=10000&name=${ prodEmpty ( ' [name].' ) } [hash].[ext]${ IMG_LOADER } `
114
134
} ,
115
135
{
116
136
test : / \. ( s v g | w o f f 2 ? | e o t | t t f ) $ / ,
117
137
loader : 'url-loader' ,
118
138
query : {
119
139
limit : 10000 ,
120
- name : '[name].[hash].[ext]'
140
+ name : ` ${ prodEmpty ( '[name].' ) } [hash].[ext]`
121
141
}
122
142
}
123
143
]
@@ -132,18 +152,18 @@ webpackConfig.plugins = [
132
152
new webpack . ContextReplacementPlugin ( / \. \/ l o c a l e $ / , null , false , / j s $ / ) ,
133
153
new webpack . DefinePlugin ( globals ) ,
134
154
new webpack . LoaderOptionsPlugin ( {
155
+ minimize : __PROD__ ,
135
156
stylus : {
136
157
default : {
137
- preferPathResolver : 'webpack' ,
138
- import : [ paths . src ( 'styles/_variables.styl' ) ]
158
+ import : [ paths . src ( 'styles/_variables.styl' ) ] ,
159
+ paths : 'node_modules/bootstrap-styl' ,
160
+ preferPathResolver : 'webpack'
139
161
}
140
162
}
141
163
} ) ,
142
164
new HtmlWebpackPlugin ( {
143
165
templateContent : pug . renderFile ( paths . src ( 'index.pug' ) , {
144
- pretty : ! config . compiler_html_minify ,
145
- title : `${ pkg . name } - ${ pkg . description } ` ,
146
- polyfill : ! __DEV__
166
+ pretty : ! config . compiler_html_minify
147
167
} ) ,
148
168
favicon : paths . src ( 'static/favicon.ico' ) ,
149
169
hash : false ,
@@ -153,7 +173,7 @@ webpackConfig.plugins = [
153
173
minifyJS : config . compiler_html_minify
154
174
}
155
175
} ) ,
156
- new CopyWebpackPlugin ( [ {
176
+ new CopyPlugin ( [ {
157
177
from : paths . src ( 'static' )
158
178
} ] , {
159
179
ignore : [ '*.ico' , '*.md' ]
@@ -162,8 +182,7 @@ webpackConfig.plugins = [
162
182
163
183
// Don't split bundles during testing, since we only want import one bundle
164
184
if ( ! __TESTING__ ) {
165
- webpackConfig . plugins . push (
166
- new webpack . optimize . CommonsChunkPlugin ( 'vendor' ) )
185
+ webpackConfig . plugins . push ( new webpack . optimize . CommonsChunkPlugin ( 'vendor' ) )
167
186
}
168
187
169
188
if ( __DEV__ ) {
@@ -186,8 +205,8 @@ if (__DEV__) {
186
205
comments : false ,
187
206
sourceMap
188
207
} ) ,
189
- new SWPrecacheWebpackPlugin ( {
190
- cacheId : 'easy-hi ' ,
208
+ new SWPrecachePlugin ( {
209
+ cacheId : 'yoga-vision ' ,
191
210
filename : 'service-worker.js' ,
192
211
dontCacheBustUrlsMatching : / ./ ,
193
212
staticFileGlobsIgnorePatterns : [ / i n d e x \. h t m l $ / , / \. m a p $ / ]
0 commit comments