Использование webpack-chain с vue-cli 3 для изменения имени сгенерированного файла - PullRequest
Новая
       7

Использование webpack-chain с vue-cli 3 для изменения имени сгенерированного файла

0 голосов
/ 18 ноября 2018

Я хочу изменить имя сгенерированного файла с app.<hash>.js на plugin.<hash>.js. Имя ключа точки входа в веб-пакет используется для определения имени. Vue-cli 3 по умолчанию использует app в качестве ключа точки входа в веб-пакет. Поэтому мне нужно это изменить. Используя vue inspect > webpack.config.resolved.js, я могу видеть весь файл веб-пакета, который решается с помощью vue-cli.

Последняя часть разрешенного файла веб-пакета: 

  }
  ...
  entry: {
    app: [
      './src/main.js'
    ]
  }

Я могу изменить значение, добавив следующее к vue.config.js. 

module.exports = {
  chainWebpack: config => {
    // Remove the old entry and add the new one
    config
      .entry('app')
      .clear()
      .add('./plugin/index.js')
  },
  ...
}

Это результат в разрешенном файле веб-пакета. 

{
  ...
  entry: {
    app: [
      './plugin/index.js'
    ]
  }
}

Я также хочу переименовать ключ app в plugin. Я думал, что смогу удалить ключ, используя config.entry.delete('app'), но это выдает ошибку.

Это я застрял. У кого-нибудь есть предложения по удалению или переименованию ключа ввода?

1 Ответ

0 голосов
/ 19 ноября 2018

Хорошо, я понял это.Вы должны использовать низкоуровневый config.entryPoints вместо config.entry. 

module.exports = {
  chainWebpack: config => {
    // Remove the old 'app' entry
    config
      .entryPoints
      .delete('app')
    // Add the new 'plugin' entry
    config
      .entry('plugin')
      .add('./plugin/index.js')
    config
      .resolve
      .alias
      .set('@', path.resolve(__dirname, 'plugin'))
  },
  ...
}

Если вы хотите внести это изменение, вам необходимо выполнить следующие шаги:

  1. Переименуйте каталог src в plugin (необязательно, но мне нравится)
  2. Добавьте файл vue.config.js с приведенным выше кодом, включая настройку псевдонима с src до plugin

  3. Обновите moduleNameMapper в jest.config.js

    ...
moduleNameMapper: {
  '^@/(.*)$': '<rootDir>/plugin/$1'
},
...

Это поможет.Теперь сгенерированный файл называется plugin.<hash>.js.

...