Vue Cli 3为不同类型的文件构建自定义目录

问题描述 投票:-1回答:1

我是使用vue构建Web应用程序的新手。默认情况下,使用npm run build,它将构建以下结构:

enter image description here

但我希望建立如下:

enter image description here

然后,我怎么能像我想要的那样把vue.config.js写成输出?

vue.js npm webpack vue-cli-3
1个回答
1
投票

使用this GitHub issue as an example,你应该能够通过在你的配置中添加这样的东西来实现这一点......

// vue.config.js
module.exports = {
  chainWebpack: config => {
    config.module.rule('images').use('url-loader')
      .loader('file-loader') // replaces the url-loader
      .tap(options => Object.assign(options, {
        name: 'images/register/[name].[hash:8].[ext]'
      }))
    config.module.rule('svg').use('file-loader')
      .tap(options => Object.assign(options, {
        name: 'images/register/[name].[hash:8].[ext]'
      }))
  },
  css: {
    extract: {
      filename: 'css/register/[name].[hash:8].css',
      chunkFilename: 'css/register/[name].[hash:8].css'
    }
  },
  configureWebpack: {
    output: {
      filename: 'js/register/[name].[hash:8].js',
      chunkFilename: 'js/register/[name].[hash:8].js'
    }
  }
}

有关更多信息和示例,请参阅https://cli.vuejs.org/config/#vue-config-js

© www.soinside.com 2019 - 2024. All rights reserved.