webpack.base.config.js
3.9 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
/**
* webpack config
* @author: shenzm<zhimin.shen@yoho.cn>
* @date: 2017/3/21
*/
'use strict';
const os = require('os');
const path = require('path');
const shelljs = require('shelljs');
const _ = require('lodash');
const webpack = require('webpack');
const HappyPack = require('happypack');
const { cssLoader, hbsLoader } = require('./utils.js');
const postcssConfig = require('./postcss.config.js');
const happyThreadPool = HappyPack.ThreadPool({ // eslint-disable-line
size: os.cpus().length
});
const getEntries = () => {
const entries = {
libs: ['babel-polyfill', 'yoho-jquery', path.join(__dirname, '../js/global.js')],
common: path.join(__dirname, '../scss/common.css'),
feature: path.join(__dirname, '../scss/feature.css')
};
// 构建各模块子页面JS
// 新的生成规则 module/page/index.js
shelljs.ls(path.join(__dirname, '../js/**/index.js')).forEach((f) => {
const dir = _.slice(f.split('/'), -3); // [modulename, page, index.js]
// Important
// 生成规则:module.page: './js/module/page/index.js'
entries[`${dir[0]}.${dir[1]}`] = path.join(__dirname, `../js/${dir.join('/')}`);
});
// 老的生成规则module.page.js
shelljs.ls(path.join(__dirname, '../js/**/*.page.js')).forEach((f) => {
const dir = _.slice(f.split('/'), -2); // [modulename, xx.page.js]
// Important
// 生成规则:module.page: './js/module/xx.page.js'
entries[`${dir[0]}.${dir[1].match(/(.*).page.js/)[1]}`] = path.join(__dirname, `../js/${dir.join('/')}`);
});
return entries;
};
module.exports = (env) => {
return {
entry: getEntries(),
output: {
path: path.join(__dirname, 'bundle'), // absolute path
filename: '[name].js'
},
module: {
rules: [{
test: /\.vue$/,
use: [{
loader: 'vue-loader',
options: {
postcss: {
plugins: postcssConfig.postcssPlugin(env),
parser: 'postcss-scss'
},
autoprefixer: false,
loaders: {
css: cssLoader(env, 'vue')
},
esModule: false
}
}],
}, {
test: /\.js$/,
exclude: [/node_modules/],
use: [{
loader: 'happypack/loader?id=js'
}]
}, {
test: /\.css$/,
use: cssLoader(env, 'css')
}, {
test: /\.hbs$/,
use: [{
loader: 'happypack/loader?id=hbs'
}]
}]
},
resolve: {
modules: [
path.join(__dirname, '../../node_modules'),
path.join(__dirname, '../vue'),
path.join(__dirname, '../hbs'),
path.join(__dirname, '../scss'),
path.join(__dirname, '../js')
],
alias: {
vue: 'vue/dist/vue.common.js'
}
},
stats: {
children: false
},
plugins: [
new HappyPack({
id: 'js',
threadPool: happyThreadPool,
loaders: ['babel-loader'],
}),
new HappyPack({
id: 'hbs',
threadPool: happyThreadPool,
loaders: [hbsLoader]
}),
new webpack.optimize.CommonsChunkPlugin({
name: 'libs',
filename: 'libs.js'
}),
new webpack.ProvidePlugin({
$: 'yoho-jquery',
jQuery: 'yoho-jquery',
'window.jQuery': 'yoho-jquery'
})
]
};
};