Блог

По умолчанию Vue-cli создает файлы следующим образом:

 - dist
-- demo.html
-- style.css
-- file.commom.js
-- file.commom.js.map
-- file.umd.js
-- file.umd.js.map
-- file.umd.min.js
-- file.umd.min.js.map
  

Я хочу, чтобы файлы были организованы таким образом:

 - dist
-- demo.html
-- css
--- style.css
-- js
--- file.commom.js
--- file.commom.js.map
--- file.umd.js
--- file.umd.js.map
--- file.umd.min.js
--- file.umd.min.js.map
  

Бонусный вопрос: Действительно ли необходимы эти общие и umd-имена? Потому что в папке node_modules я не вижу никаких проектов с этими именами.

Вы можете добиться этого, изменив конфигурацию вашего webpack.

Взгляните на эту проблему здесь:https://github.com/vuejs/vue-cli/issues/1967

 module.exports = {
    chainWebpack: (config) => {
    config.module
      .rule('images')
      .use('url-loader')
      .tap(options => Object.assign({}, options, { name: '[name].[ext]' }));
  },
  css: {
    extract: {
      filename: '[name].css',
      chunkFilename: '[name].css',
    },
  },
  configureWebpack: {
    output: {
      filename: '[name].js',
      chunkFilename: '[name].js',
    }
  }
};
  

Это приведенный пример, но вы можете изменить ключи chunkFilname и filename, чтобы включить папку как часть пути. Например 'javascript/[name].js'