test: add test for dynamic CSS imports

Author: webdiscus

package.json

@@ -1,6 +1,6 @@
 {
   "name": "webpack-remove-empty-scripts",
-  "version": "1.1.0",
+  "version": "1.1.1",
   "description": "Webpack plugin removes empty JavaScript files generated when using styles.",
   "keywords": [
     "webpack",

package.npm.json

@@ -1,6 +1,6 @@
 {
   "name": "webpack-remove-empty-scripts",
-  "version": "1.1.0",
+  "version": "1.1.1",
   "description": "Webpack plugin removes empty JavaScript files generated when using styles.",
   "keywords": [
     "webpack",
@@ -23,7 +23,7 @@
     "url": "https://patreon.com/biodiscus"
   },
   "repository": "webdiscus/webpack-remove-empty-scripts",
-  "main": "src/index.js",
+  "main": "index.js",
   "engines": {
     "node": ">=12.14"
   },

test/cases/css-import-dynamic/expected/main.css

@@ -0,0 +1,3 @@
+.vendor {
+  color: red;
+}

test/cases/css-import-dynamic/expected/main.js

@@ -0,0 +1,6 @@
+html,
+body {
+  width: 100%;
+  height: 100%;
+}
+

test/cases/css-import-dynamic/expected/style.css

@@ -0,0 +1,3 @@
+// Note: for dynamic CSS imports, in addition to using RemoveEmptyScriptsPlugin(), you must specify webpackMode: "eager"
+import(/* webpackMode: "eager" */ './vendor.css');
+console.log('main');

test/cases/css-import-dynamic/src/main.js

@@ -0,0 +1,5 @@
+html,
+body {
+  width: 100%;
+  height: 100%;
+}

test/cases/css-import-dynamic/src/style.css

@@ -0,0 +1,3 @@
+.vendor {
+  color: red;
+}

test/cases/css-import-dynamic/src/vendor.css

@@ -0,0 +1,28 @@
+const path = require('path');
+const MiniCssExtractPlugin = require('mini-css-extract-plugin');
+const RemoveEmptyScriptsPlugin = require('webpack-remove-empty-scripts');
+
+module.exports = {
+  mode: 'production',
+  output: {
+    path: path.join(__dirname, 'dist/'),
+  },
+  entry: {
+    main: ['./src/main.js' ],
+    style: ['./src/style.css'],
+  },
+  module: {
+    rules: [
+      {
+        test: /\.css$/,
+        use: [MiniCssExtractPlugin.loader, 'css-loader'],
+      },
+    ],
+  },
+  plugins: [
+    new RemoveEmptyScriptsPlugin(),
+    new MiniCssExtractPlugin({
+      filename: '[name].css',
+    }),
+  ],
+};

test/cases/css-import-dynamic/webpack.config.js

@@ -16,6 +16,7 @@ describe('options tests', () => {
 describe('common use case tests', () => {
   test('css-entry-only', () => compareFiles( 'css-entry-only'));
   test('css-import', () => compareFiles( 'css-import'));
+  test('css-import-dynamic', () => compareFiles( 'css-import-dynamic'));
   test('css-entry-with-ignored-hmr', () => compareFiles( 'css-entry-with-ignored-hmr', false));
   test('css-entry-with-query', () => compareFiles( 'css-entry-with-query'));
   test('multi-configuration', () => compareFiles( 'multi-configuration'));