如何在 Vue.js 中排除文件(例如配置文件)?

Question

• https://cli.vuejs.org/config/#configurewebpack
• https://cli.vuejs.org/config/#chainwebpack

我试过：

chainWebpack: config => {
config.merge({
module: {
rules: [{
test: /.jsx?$/,
exclude: {
exclude: [path.resolve(__dirname, "public/my-config.js")]
}
}]
}
})
}

或

config.module.rule('js')
.exclude({
exclude: path.resolve(__dirname, "public/my-config.js")
})

但它不起作用。

我想在pages/index.html中导入带有脚本标签的public/my-config.js，或者只是import { config1, config2 } from '../public/my-config'.

我能够使用externals在 webpack 中不包含模块，但使用 Vue.js 不是很直观。

我必须在dist/上提供my-config.js，以便可以对其进行编辑。

Answer 1

参考：

• https://github.com/neutrinojs/webpack-chain#config-plugins-modify-arguments
• https://github.com/webpack-contrib/copy-webpack-plugin#ignore

我在vue.config.js中写的：

const path = require("path");
module.exports = {
baseUrl: ".",
chainWebpack: config => {
config.plugin('copy').tap((args) => [[
{
from: '/path/to/my_project/public',
to: '/path/to/my_project/dist',
toType: 'dir',
ignore: [
'index.html',
'.DS_Store',
'config.data.js'
]
}
]]
);
}
}

我使用$ vue inspect > output.js然后检查了output.js文件，以了解config.plugin('copy')使用了哪些参数，这恰好是new CopyWebpackPlugin的实例。

Answer 2

参考： https://github.com/vuejs/vue-cli/issues/2231#issuecomment-413441633

试试这个，更简单：

module.exports = {
chainWebpack: config => {
config.plugin('copy').tap(([options]) => {
options[0].ignore.push('api/**/*')
return [options]
})
}
}