Удалить хэш из определенных файлов активов в веб-пакете

Question

Я использую Vuejs в новом проекте и добавил несколько изображений в папку assets.Мне нужно, чтобы изображение также можно было ссылать в public/index.html, но когда я собираю проект, получающееся имя файла включает в себя хэш.

Например, у меня есть src/assets/logo.svg, а после сборки у меня dist/img/logo.e80b121e.svg,но я хочу dist/img/logo.svg

Есть ли способ удалить хэш только для определенного файла?Мне нужен хеш в других активах.Я настраиваю веб-пакет с vue.config.js.

Answer 1

Вам нужно извлечь файлы ресурсов из записи, предполагая, что у вас настроен chunckhash (что-то вроде этого: output: {filename: "[name].[chunkhash].js"}).Вы можете скопировать напрямую из источника и добавить ресурсы в index.html, используя некоторые из следующих плагинов веб-пакета:

• CopyWebpackPlugin

• HtmlWebpackExternalsPlugin

пример:

plugins: [
    new HtmlWebpackExternalsPlugin({
      externals: [
        {
          module: "@fortawesome/fontawesome-pro",
          entry: "css/all.css",
        },
      ],
    }),
    new CopyWebpackPlugin([
      {
        from: "./node_modules/@fortawesome/fontawesome-pro/webfonts",
        to: "./vendor/@fortawesome/fontawesome-pro/webfonts/",
      },
    ]),
  ]

Answer 2

Если вы используете webpack config vue cli, сгенерированное четырьмя, то при перемещении вашего ресурса в папку static он не будет хэшем.

Элементы из assets хэшируются.