一、webpack-核心概念-entry/output
entry:
入口起点指示 webpack 应该使用哪个模块,来作为构建其内部依赖图的开始。
默认值是
./src/index.js
,但你可以通过在 webpack configuration 中配置entry
属性,来指定一个(或多个)不同的入口起点
output:
output 属性告诉 webpack 在哪里输出它所创建的打包文件,以及如何命名这些文件
默认值是
./dist/main.js
,其他生成文件默认放置在./dist
文件夹中。
总结:
webpack的打包入口可以是一个也可以是多个,出口也是可以有一个也可以有多个,完全取决于webpack.config.js的配置。当打包入口有多个,但是又希望,打包的出口可以不用在入口改变的时候,手动维护。那么我们可以修改配置文件,使得出口文件的与入口文件列举的键值一一对应,定义了什么入口文件,就生成什么出口文件。
二、具体配置
1. 配置多个入口,多个出口
entry: {
main: './src/index.js'
sub: './src/sub.js'
},
output: {
filename: '[name].js', // 使用占位符
path: path.resolve(__dirname, 'dist')
},
2. 配置输出前缀
// 输出前缀加上CDN地址
output: {
publicPath: 'http://cdn.com.cn'
filename: '[name].js', // 使用占位符
path: path.resolve(__dirname, 'dist')
},