vue.config.js中assetsDir路径

Question

vue.config.js中assetsDir路径如何根据src的子目录创建
如src下{ list1、list2、list3 }三个目录，统一打包时候静态资源怎么设置为dist/static{ list1:{css、img、font、js}、list2:{css、img、font、js}、list3:{css、img、font、js} }

Answer 1

该回答引用ChatGPT

您可以通过在 vue.config.js 中配置 assetsDir 和自定义 outputDir 来实现这个目标。首先，您需要在 vue.config.js 中指定 assetsDir，以指定静态资源的输出目录。例如：

module.exports = {
  assetsDir: 'static',
  outputDir: 'dist',
};

上面的配置将所有的静态资源输出到 dist/static 目录中。

接下来，您需要在您的项目中的每个子目录下分别创建 vue.config.js 文件，并在其中配置每个子目录的 outputDir，以使静态资源可以分别输出到 dist/static/list1、dist/static/list2、dist/static/list3 目录中。例如：

module.exports = {
  outputDir: 'dist/static/list1',
};

module.exports = {
  outputDir: 'dist/static/list2',
};

module.exports = {
  outputDir: 'dist/static/list3',
};

这样，当您运行 npm run build 时，每个子目录中的静态资源将会被分别输出到对应的目录中。注意，如果您在每个子目录中使用了不同的静态资源目录（如 css、img、font、js），则需要在每个子目录的 vue.config.js 文件中相应地进行配置。