Commit 36fa7c6c18ca5aab2aa335fa49154eeb90700942
1 parent
2ce6a5df
update webpack config of test
update webpack config of test
Showing
1 changed file
with
75 additions
and
26 deletions
Show diff stats
build/webpack.dev.config.js
... | ... | @@ -21,41 +21,90 @@ module.exports = { |
21 | 21 | }, |
22 | 22 | // 加载器 |
23 | 23 | module: { |
24 | - loaders: [ | |
25 | - { test: /\.vue$/, loader: 'vue' }, | |
26 | - { test: /\.js$/, loader: 'babel', exclude: /node_modules/ }, | |
27 | - { test: /\.css$/, loader: 'style!css!autoprefixer'}, | |
28 | - { test: /\.less$/, loader: 'style!css!less' }, | |
29 | - { test: /\.scss$/, loader: 'style!css!sass?sourceMap'}, | |
24 | + // https://doc.webpack-china.org/guides/migrating/#module-loaders-module-rules | |
25 | + rules: [ | |
26 | + { | |
27 | + // https://vue-loader.vuejs.org/en/configurations/extract-css.html | |
28 | + test: /\.vue$/, | |
29 | + loader: 'vue-loader', | |
30 | + options: { | |
31 | + loaders: { | |
32 | + css: ExtractTextPlugin.extract({ | |
33 | + use: 'css-loader', | |
34 | + fallback: 'vue-style-loader' // <- this is a dep of vue-loader, so no need to explicitly install if using npm3 | |
35 | + }) | |
36 | + }, | |
37 | + postLoaders: { | |
38 | + html: 'babel-loader' | |
39 | + } | |
40 | + } | |
41 | + }, | |
42 | + // { test: /\.vue$/, loader: 'vue' }, | |
43 | + // Module build failed: Error: The node API for `babel` has been moved to `babel-core`. | |
44 | + // https://github.com/babel/babel-loader/blob/master/README.md#the-node-api-for-babel-has-been-moved-to-babel-core | |
45 | + { | |
46 | + test: /\.js$/, | |
47 | + loader: 'babel-loader', exclude: /node_modules/ | |
48 | + }, | |
49 | + { | |
50 | + test: /\.css$/, | |
51 | + use: [ | |
52 | + 'style-loader', | |
53 | + 'css-loader', | |
54 | + 'autoprefixer-loader' | |
55 | + ] | |
56 | + }, | |
57 | + { | |
58 | + test: /\.less$/, | |
59 | + use: [ | |
60 | + 'style-loader', | |
61 | + 'css-loader', | |
62 | + 'less-loader' | |
63 | + ] | |
64 | + // loader: 'style!css!less' | |
65 | + }, | |
66 | + { | |
67 | + test: /\.scss$/, | |
68 | + use: [ | |
69 | + 'style-loader', | |
70 | + 'css-loader', | |
71 | + 'sass-loader?sourceMap' | |
72 | + ] | |
73 | + // loader: 'style!css!sass?sourceMap' | |
74 | + }, | |
30 | 75 | { test: /\.(gif|jpg|png|woff|svg|eot|ttf)\??.*$/, loader: 'url-loader?limit=8192'}, |
31 | 76 | { test: /\.(html|tpl)$/, loader: 'html-loader' } |
32 | 77 | ] |
33 | 78 | }, |
34 | - vue: { | |
35 | - loaders: { | |
36 | - css: ExtractTextPlugin.extract( | |
37 | - "style-loader", | |
38 | - "css-loader?sourceMap", | |
39 | - { | |
40 | - publicPath: "/test/dist/" | |
41 | - } | |
42 | - ), | |
43 | - less: ExtractTextPlugin.extract( | |
44 | - 'vue-style-loader', | |
45 | - 'css-loader!less-loader' | |
46 | - ), | |
47 | - js: 'babel' | |
48 | - } | |
49 | - }, | |
79 | + // vue: { | |
80 | + // loaders: { | |
81 | + // css: ExtractTextPlugin.extract( | |
82 | + // "style-loader", | |
83 | + // "css-loader?sourceMap", | |
84 | + // { | |
85 | + // publicPath: "/test/dist/" | |
86 | + // } | |
87 | + // ), | |
88 | + // less: ExtractTextPlugin.extract( | |
89 | + // 'vue-style-loader', | |
90 | + // 'css-loader!less-loader' | |
91 | + // ), | |
92 | + // js: 'babel' | |
93 | + // } | |
94 | + // }, | |
50 | 95 | resolve: { |
51 | 96 | // require时省略的扩展名,如:require('module') 不需要module.js |
52 | - extensions: ['', '.js', '.vue'], | |
97 | + extensions: ['.js', '.vue'], | |
53 | 98 | alias: { |
54 | - iview: '../../src/index' | |
99 | + iview: '../../src/index', | |
100 | + vue: 'vue/dist/vue.js' | |
55 | 101 | } |
56 | 102 | }, |
57 | 103 | plugins: [ |
58 | - new ExtractTextPlugin("[name].css",{ allChunks : true,resolve : ['modules'] }), // 提取CSS | |
59 | - new webpack.optimize.CommonsChunkPlugin('vendors', 'vendors.js'), // 提取第三方库 | |
104 | + new ExtractTextPlugin({ filename: '[name].css', disable: false, allChunks: true }), | |
105 | + // new ExtractTextPlugin("[name].css",{ allChunks : true,resolve : ['modules'] }), // 提取CSS | |
106 | + // https://doc.webpack-china.org/plugins/commons-chunk-plugin/ | |
107 | + new webpack.optimize.CommonsChunkPlugin({ name: 'vendors', filename: 'vendor.bundle.js' }) | |
108 | + // new webpack.optimize.CommonsChunkPlugin('vendors', 'vendors.js'), // 提取第三方库 | |
60 | 109 | ] |
61 | 110 | }; | ... | ... |