WebPack многократно вставляет избыточные теги скрипта в index. html при загрузке - PullRequest
0 голосов
/ 08 мая 2020

Изучаем WebPack и настроили его для создания индекса. html из шаблона и вставляем тег <script> с файлом пакета, который включает уникальный контент ha sh (чтобы обойти кеширование браузера и обеспечить новый контент загружен), например: bundle-[contentHash].js.

Я использую json-server и запускаю webpack -d -w как скрипт из NPM. Когда я запускаю сценарии и загружаю страницу, он постоянно добавляет идентичные теги <script> в index. html файл снова и снова.

webpack.config. js:

const webpack = require("webpack")
const path = require("path")
var htmlPlugin = require("html-webpack-plugin")

module.exports = {
  // context: path.resolve(__dirname),
  entry: "./client/index.jsx",
  output: {
    path: path.join(__dirname, "/public"),
    publicPath: path.join(__dirname, "/public"),
    filename: "bundle-[contentHash].js"
  },
  module: {
    rules: [
      {
        test: /\.jsx?$/,
        exclude: /node_modules/,
        use: {
          loader: "babel-loader"
        }
      }
    ]
  },
  plugins: [
    new htmlPlugin({
      template: "./public/index.html"
    })
  ]
}

1 Ответ

0 голосов
/ 08 мая 2020

Повторное внедрение тега <script> было вызвано тем, что имя шаблона (index. html) совпадает с именем вывода по умолчанию html-webpack-plugin.

Переименование моего шаблона из Исправлена ​​проблема с index.html по template.html.

  plugins: [
    new htmlPlugin({
      template: "./public/template.html"
    })
  ]
...