Пакет Webpack генерирует дополнительный файл JS вместе с файлом CSS - PullRequest
Новая
       60

Пакет Webpack генерирует дополнительный файл JS вместе с файлом CSS

0 голосов
/ 12 октября 2018

Ниже приведена моя конфигурация веб-пакета 

const path = require('path');
const webpack = require('webpack');
const CleanWebpackPlugin = require('clean-webpack-plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const MiniCssExtractPlugin = require("mini-css-extract-plugin");

module.exports = {
    entry: {
        app: './src/index.js',
        style: './src/style.less',
        bootstrap: './node_modules/bootstrap/dist/css/bootstrap.min.css'        
    },
    plugins: [
        new CleanWebpackPlugin(['dist']),
        new HtmlWebpackPlugin({
            title: 'Test Application',
            template: './src/index.html'
        }),
        new MiniCssExtractPlugin({
            filename: this.mode == "development" ? '[name].css' : '[name].[hash].css',
            chunkFilename: this.mode == "development" ? '[id].css' : '[id].[hash].css',
        })
],
output: {
    filename: '[name].[hash].js',
    path: path.resolve(__dirname, 'dist'),
},
module: {
    rules: [
        {
            test: /\.css$/,
            use: [
                { loader: "style-loader" },
                { loader: "css-loader" },
              ],
        },
        {
            test: /\.less$/,
            use: [MiniCssExtractPlugin.loader, 'css-loader', 'less-loader']
        },
        {
            test: /\.(png|svg|jpg|gif)$/,
            use: [
                'file-loader'
            ]
        }
    ]
}

};

Он генерирует style.js вместе со style.css , я не понимаю, почему он генерируетthe style.js.

Также для начальной загрузки: './node_modules/bootstrap/dist/css/bootstrap.min.css'; он генерирует bootstrap.js вместо bootstrap.css. снова, я не понимаю этого.

Примечание: я хотел, чтобы приложение сначала загружалось с помощью css, поэтомувеб-страница не должна ждать / отображать различные CSS один за другим.Поэтому я не использовал оператор импорта и не указал путь к файлу CSS внутри записи.

Приложение работает, как и ожидалось, Я что-то упустил, или в коде есть какое-то исправление?

1 Ответ

0 голосов
/ 12 октября 2018

Похоже на известную проблему в веб-пакете.Вы можете просто проигнорировать сгенерированный файл, и вам не нужно ссылаться на то же самое на своей странице.

Вы можете посмотреть обсуждение проблемы здесь

https://github.com/webpack-contrib/extract-text-webpack-plugin/issues/518

...