Конфигурация Webpack не генерирует index.html в общей папке

1

У меня небольшие проблемы с моей конфигурацией webpack, по какой-то причине он не создает файл index.html в моей/общей папке.

См. Webpack.config.js ниже:

const path = require("path");
const ExtractTextPlugin = require("extract-text-webpack-plugin");

let DEBUG;

if (process.env.NODE_ENV === "production") {
  DEBUG = false;
} else {
  DEBUG = true; // process.env.NODE_ENV === "development"
}
//const DEBUG = true; // process.env.NODE_ENV === "development"

module.exports = {
  context: path.resolve(__dirname, "src"),
  entry: "./index.js",
  output: {
    path: path.resolve(__dirname, "public"),
    filename: DEBUG ? "bundle.js" : "bundle.min.js"
  },
  module: {
    loaders: [
      {
        test: /\.js$/,
        loader: "babel-loader",
        exclude: /node_modules/
      },
      {
        test: /\.jsx$/,
        loader: "babel-loader",
        exclude: /node_modules/,
        options: {
          presets: ["react", "es2015"]
        }
      },
      {
        test: /\.scss$/,
        loaders: DEBUG
          ? [
              "style-loader",
              "css-loader?sourceMap",
              "sass-loader?sourceMap",
              "postcss-loader"
            ]
          : ExtractTextPlugin.extract("css-loader!sass-loader!postcss-loader")
      },
      {
        test: /\.(ttf|eot|svg)(\?[\s\S]+)?$/,
        use: "file-loader?name=images/[name].[ext]"
      }
    ]
  },
  devServer: {
    historyApiFallback: true,
    hot: true,
  },
  plugins: [
    new ExtractTextPlugin("style.css", {
      allChunks: true
    })
  ]
};

У меня есть один в моем корневом каталоге, и когда я запускаю в режиме разработки, все работает нормально. Сценарий сборки "build": "NODE_ENV =" production "webpack -p".

Спасибо

Теги:
webpack
web-development-server

1 ответ

1
Лучший ответ

Вам нужен HTML Webpack Plugin. Этот плагин создает для вас html файл и добавляет каждую запись, определенную в файле поддержки webpacks, к вашему html. Не забудьте установить его.

$ npm install html-webpack-plugin --save-dev

Затем в конфигурации вашего веб-пакета:

var HtmlWebpackPlugin = require('html-webpack-plugin');

...

plugins: [
    new ExtractTextPlugin("style.css", {
      allChunks: true
    }),
    new HtmlWebpackPlugin()
  ]

Для получения дополнительной информации см. Здесь: https://github.com/jantimon/html-webpack-plugin

  • 0
    Спасибо Даниэль, работает угощение. Любая идея, как я могу изменить sss / js src в сгенерированном файле index.html с public / bundle.min.js на bundle.min.js, так как все файлы уже находятся в общей папке.
  • 0
    Пожалуйста, примите мой ответ, если он вам помог. (щелкните стрелку). В свой вопрос: добавьте prop publicPath к выходному. publicPath: '/' Это то, что htmlwebpackplugin добавляет к полям src. Просто поиграйте немного с этой опорой.
Показать ещё 1 комментарий

Ещё вопросы

Сообщество Overcoder
Наверх
Меню