output: {
// webpack 如何输出结果的相关选项
path: path.resolve(__dirname, "dist"), // string
// 所有输出文件的目标路径
// 必须是绝对路径（使用 Node.js 的 path 模块）
filename: "bundle.js", // string
filename: "[name].js", // 用于多个入口点(entry point)（出口点？）
filename: "[chunkhash].js", // 用于长效缓存
// 「入口分块(entry chunk)」的文件名模板（出口分块？）
publicPath: "/assets/", // string
publicPath: "",
publicPath: "https://cdn.example.com/",
// 输出解析文件的目录，url 相对于 HTML 页面
library: "MyLibrary", // string,
// 导出库(exported library)的名称
libraryTarget: "umd", // 通用模块定义
libraryTarget: "umd2", // 通用模块定义
libraryTarget: "commonjs2", // exported with module.exports
libraryTarget: "commonjs-module", // 使用 module.exports 导出
libraryTarget: "commonjs", // 作为 exports 的属性导出
libraryTarget: "amd", // 使用 AMD 定义方法来定义
libraryTarget: "this", // 在 this 上设置属性
libraryTarget: "var", // 变量定义于根作用域下
libraryTarget: "assign", // 盲分配(blind assignment)
libraryTarget: "window", // 在 window 对象上设置属性
libraryTarget: "global", // property set to global object
libraryTarget: "jsonp", // jsonp wrapper
// 导出库(exported library)的类型
/* 高级输出配置（点击显示） */
pathinfo: true, // boolean
// 在生成代码时，引入相关的模块、导出、请求等有帮助的路径信息。
chunkFilename: "[id].js",
chunkFilename: "[chunkhash].js",
// 长效缓存(/guides/caching)
// 附加分块(additional chunk)」的文件名模板
jsonpFunction: "myWebpackJsonp", // string
// 用于加载分块的 JSONP 函数名
sourceMapFilename: "[file].map", // string
sourceMapFilename: "sourcemaps/[file].map", // string
// 「source map 位置」的文件名模板
devtoolModuleFilenameTemplate: "webpack:///[resource-path]", // string
// 「devtool 中模块」的文件名模板
devtoolFallbackModuleFilenameTemplate: "webpack:///[resource-path]?[hash]", // string
// 「devtool 中模块」的文件名模板（用于冲突）
umdNamedDefine: true, // boolean
// 在 UMD 库中使用命名的 AMD 模块
crossOriginLoading: "use-credentials", // 枚举
crossOriginLoading: "anonymous",
crossOriginLoading: false,
// 指定运行时如何发出跨域请求问题
/* 专家级输出配置（自行承担风险） */
devtoolLineToLine: {
test: /\.jsx$/
},
// 为这些模块使用 1:1 映射 SourceMaps（快速）
hotUpdateMainFilename: "[hash].hot-update.json", // string
// 「HMR 清单」的文件名模板
hotUpdateChunkFilename: "[id].[hash].hot-update.js", // string
// 「HMR 分块」的文件名模板
sourcePrefix: "\t", // string
// 包内前置式模块资源具有更好可读性
},
3)Plugins
例如： 安装 html-webpack-plugin
命令： npm install html-webpack-plugin --save-dev
首先在webpack.config.js 中引入插件
var htmlWebPackPlugin = require('html-webpack-plugin');
然后在:
plugins: [
new htmlWebPackPlugin({
// 指定生成的文件的名字
filename:'index.html',
// 指定html 模板
template:'index.html',
// 标签生成的位置
inject:'head',
/* title:'webpack is good',
data: new Date()*/
minify:{
// 删除注释
removeComments:true,
// 删除空格
collapseWhitespace: true
}
})]
京公网安备 11010802041100号