我可以使用 webpack 单独缩小文件吗?
Can I minify file separately with webpack?
我有一个项目,其中有很多 JavaScript 个文件,它们分别位于多个文件夹中。
root
| - index.html
| - lib
| -- jquery-ui.js
| -- jquery.js
| -- html2canvas.js
|
| - js
| -- main.js
| -- app1.js
| -- app2.js
| -- app3.js
并且O需要使用webpack分别压缩这些文件,使每个文件保持其路径。
我不希望一个文件包含所有代码。
我目前的配置:
const path = require('path');
module.exports = {
entry:[
'./js/index.js',
'./pages/MCF/js/index.js',
'./pages/MCF/js/refresh.js',
'./pages/MCF/lang/index.js',
'./pages/MCF/lib/scriptJs/script.js',
'./pages/MCF/lib/scriptJs/load.js'
],
output :{
path :path.resolve('./prod/js'),
filename: "app.min.js"
},
module:{
rules:[
{
test:/\.js$/,
exclude: /(node_modules|bower_components)/,
use:['babel-loader']
}
]
}
}
You can take a reference from here for multiple-entry-points.
这是构建单独文件的方式:
module.exports = {
entry:{
main : './js/index.js',
main2 : './pages/MCF/js/index.js',
refresh : './pages/MCF/js/refresh.js',
langindex : './pages/MCF/lang/index.js',
script : './pages/MCF/lib/scriptJs/script.js',
load : './pages/MCF/lib/scriptJs/load.js'
},
output :{
path :path.resolve('./prod/js'),
filename: "[name].min.js"
},
...
};
[name].min.js
此 [name]
可让您将每个条目的构建保存为给定的名称(键)。输出将是:
./prod/js/main.js,
./prod/js/main2.js
// so on
我有一个项目,其中有很多 JavaScript 个文件,它们分别位于多个文件夹中。
root
| - index.html
| - lib
| -- jquery-ui.js
| -- jquery.js
| -- html2canvas.js
|
| - js
| -- main.js
| -- app1.js
| -- app2.js
| -- app3.js
并且O需要使用webpack分别压缩这些文件,使每个文件保持其路径。
我不希望一个文件包含所有代码。
我目前的配置:
const path = require('path');
module.exports = {
entry:[
'./js/index.js',
'./pages/MCF/js/index.js',
'./pages/MCF/js/refresh.js',
'./pages/MCF/lang/index.js',
'./pages/MCF/lib/scriptJs/script.js',
'./pages/MCF/lib/scriptJs/load.js'
],
output :{
path :path.resolve('./prod/js'),
filename: "app.min.js"
},
module:{
rules:[
{
test:/\.js$/,
exclude: /(node_modules|bower_components)/,
use:['babel-loader']
}
]
}
}
You can take a reference from here for multiple-entry-points.
这是构建单独文件的方式:
module.exports = {
entry:{
main : './js/index.js',
main2 : './pages/MCF/js/index.js',
refresh : './pages/MCF/js/refresh.js',
langindex : './pages/MCF/lang/index.js',
script : './pages/MCF/lib/scriptJs/script.js',
load : './pages/MCF/lib/scriptJs/load.js'
},
output :{
path :path.resolve('./prod/js'),
filename: "[name].min.js"
},
...
};
[name].min.js
此 [name]
可让您将每个条目的构建保存为给定的名称(键)。输出将是:
./prod/js/main.js,
./prod/js/main2.js
// so on