webpack-contrib / mini-css-extract-plugin

Lightweight CSS extraction plugin
MIT License
4.66k stars 389 forks source link

miniCssExtractPlugin will reduce the number of modules for the second time when cache is enabled #1064

Closed 2239559319 closed 9 months ago

2239559319 commented 10 months ago
// webpack.config.js
const { join } = require('path');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');

/**
 * @type {import('webpack').Configuration}
 */
const config = {
  entry: './src/index.js',
  mode: 'development',
  output: {
    path: join(__dirname, 'dist'),
    filename: '[name].js',
  },
  cache: {
    type: 'filesystem',
  },
  module: {
    rules: [
      {
        test: /\.css$/i,
        oneOf: [
          {
            use: [MiniCssExtractPlugin.loader, 'css-loader'],
          }
        ]
      },
    ],
  },
  plugins: [
    new MiniCssExtractPlugin(),
  ]
};

module.exports = config;

// run.js
const { webpack } = require('webpack');
const config = require('./webpack.config');

const compiler = webpack(config);

compiler.watch({
  aggregateTimeout: 20,
}, (err, res) => {
  const json = res.toJson().modules;
  console.log(json.length);
})
// src/index.js
import './index.css'
console.log('hello world');
// src/index.css
* {
  margin: 0;
  padding: 0;
}

Bug report

Actual Behavior

The first output is 11 and modify the src/index.js to tigger a new compilation and then output is 4

Expected Behavior

The length of modules is consistent in different compilation

How Do We Reproduce?

clone https://gitlab.com/2239559319/minicssextractplugin-demo and run command node run.js, and mofidy hello world string insrc/index.js file. Watch the output.

Please paste the results of npx webpack-cli info here, and mention other relevant information

alexander-akait commented 9 months ago

Expected, less work on the second run, so less modules which we touch, I want to say - it works as expected