Javascript 如何让webpack将其输出发送到两个位置?
我目前的配置如下:Javascript 如何让webpack将其输出发送到两个位置?,javascript,webpack,configuration,Javascript,Webpack,Configuration,我目前的配置如下: output: { filename: 'bundle.js', path: OUT_DIR }, 但是我需要bundles.js才能转到两个目录 我可以通过简单地将目录数组传递给path来实现这一点吗 还是我需要做更复杂的事情 目前,我有一个bash脚本cpll,每次构建之后我都必须手动输入,这很乏味 希望web pack有一个配置选项,可以将输出发送到两个或多个位置 研究 这个问题已经4年了,没有我想要的- 文档中没有提到在这里执行此操作的方法- 如果没有配置
output: {
filename: 'bundle.js',
path: OUT_DIR
},
但是我需要bundles.js才能转到两个目录
我可以通过简单地将目录数组传递给path来实现这一点吗
还是我需要做更复杂的事情
目前,我有一个bash脚本cpll
,每次构建之后我都必须手动输入,这很乏味
希望web pack有一个配置选项,可以将输出发送到两个或多个位置
研究
这个问题已经4年了,没有我想要的-
文档中没有提到在这里执行此操作的方法-
如果没有配置选项,如何让它自动运行bash命令?
我尝试将字符串数组而不是字符串传递给它,结果它崩溃了,出现了一个明显的错误:
无效的配置对象。已使用
与API架构不匹配的配置对象。
-configuration.output.path应为字符串
传递数组将不起作用。嗯
尝试另一种方法,从谷歌开始-
提出一个可能的解决方案-
每个请求-完成exportFunc
const exportFunc = ( env ) => {
console.log('webpack.config.js-exportFunc', OUT_DIR);
return {
entry: `${IN_DIR}/index.jsx`,
output: {
filename: 'bundle.js',
path: '/Users/c/_top/ll-front/dist'
},
module: {
rules: [
{
test: /\.css$/,
use: [ 'style-loader', 'css-loader' ]
},
{
test: /\.jsx?/,
include: IN_DIR,
use: {
loader: 'babel-loader',
options: {
presets: ['@babel/preset-env', '@babel/preset-react'],
plugins: ['@babel/plugin-proposal-object-rest-spread', '@babel/plugin-proposal-class-properties'],
}
}
}
]
}
};
};
module.exports = exportFunc;
您可以通过导出配置数组来使用
如文件所示:
您可以导出多个配置(自webpack 3.1.0以来支持多个功能),而不是导出单个配置对象/功能。运行webpack时,将生成所有配置
例如:
const config = {
// your webpack config
}
const outputPaths = ["path/one", "path/two"]
module.exports = outputPaths.map(outputPath => {
return {
...config,
name: outputPath,
output: {
...config.output,
path: path.resolve(__dirname, outputPath)
}
}
})
在使用函数配置时,可以执行以下操作:
const outputPaths = ["path/one", "path/two"]
module.exports = outputPaths.map(outputPath => {
return env => {
return {
entry: `${IN_DIR}/index.jsx`,
output: {
filename: 'bundle.js',
path: path.resolve(__dirname, outputPath)
},
module: {
rules: [
{
test: /\.css$/,
use: [ 'style-loader', 'css-loader' ]
},
{
test: /\.jsx?/,
include: IN_DIR,
use: {
loader: 'babel-loader',
options: {
presets: ['@babel/preset-env', '@babel/preset-react'],
plugins: ['@babel/plugin-proposal-object-rest-spread', '@babel/plugin-proposal-class-properties'],
}
}
}
]
}
};
}
})
您可以改为使用多个配置。这是我的建议 <> >避免代码复制,将当前配置视为对象。然后复制该对象并覆盖复制对象的输出部分。最后将两个对象放入一个数组中。将该数组用作新配置
var yourCurrentConfig = {...};
var secondaryDestinationConfig = Object.assign(yourCurrentConfig, {
output: {
path: {
filename: 'bundle.js',
path: SECONDARY_DIR
}
}
});
var newConfig = [
yourCurrentConfig, secondaryDestinationConfig
];
看来我需要用这种方法重新考虑我的整个配置文件?@j.a.为什么?在某个时刻,你有一个对象,它是你的网页配置。与其直接导出,不如如上所述,导出一组配置,这些配置使用现有的webpack配置作为“基本”配置。分享你的网页包配置,我会告诉你。分享我的exportFunc以上+。