@corespeed/webpack 0.1.0-beta.2 → 0.1.0-beta.4

package/dist/index.cjs

@@ -19,11 +19,11 @@ var isCI = require('is-ci');
 var prompts = require('@clack/prompts');
 var installPkg = require('@antfu/install-pkg');
 var castArray = require('foxts/cast-array');
+var path = require('node:path');
 var LightningCSS = require('lightningcss');
 var reactCompilerWebpack = require('react-compiler-webpack');
-var TerserPlugin = require('terser-webpack-plugin');
+var TerserWebpackPlugin = require('terser-webpack-plugin');
 var lightningcssLoader = require('lightningcss-loader');
-var path = require('node:path');
 
 var _documentCurrentScript = typeof document !== 'undefined' ? document.currentScript : null;
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
@@ -37,9 +37,9 @@ var WebpackBarProgressPlugin__default = /*#__PURE__*/_interopDefault(WebpackBarP
 var MiniCssExtractPlugin__default = /*#__PURE__*/_interopDefault(MiniCssExtractPlugin);
 var TsconfigPathsPlugin__default = /*#__PURE__*/_interopDefault(TsconfigPathsPlugin);
 var isCI__default = /*#__PURE__*/_interopDefault(isCI);
-var LightningCSS__default = /*#__PURE__*/_interopDefault(LightningCSS);
-var TerserPlugin__default = /*#__PURE__*/_interopDefault(TerserPlugin);
 var path__default = /*#__PURE__*/_interopDefault(path);
+var LightningCSS__default = /*#__PURE__*/_interopDefault(LightningCSS);
+var TerserWebpackPlugin__default = /*#__PURE__*/_interopDefault(TerserWebpackPlugin);
 
 function getSupportedBrowsers(browserlists, dir, isDevelopment) {
     if (browserlists) {
@@ -291,6 +291,44 @@ const resolve = ({ cwd, lodashTreeShaking })=>async (config)=>{
                 config.resolve.fallback['lodash-es/fp'] = globalRequire.resolve('lodash/fp');
             }
         }
+        /**
+   * tailwind-merge optimization
+   *
+   * webpack do not repect the order in the `conditionNames` config
+   * instead, it prioritize the order in the `exports` field of package.json
+   *
+   * since tailwind-merge list its CommonJS export before ESM export, webpack will
+   * always piroritize CommonJS version.
+   *
+   * We can use alias to force webpack to use the ESM version
+   */ try {
+            const tailwindMergeDistDir = globalRequire.resolve('tailwind-merge');
+            config.resolve.alias ??= {};
+            if (!Array.isArray(config.resolve.alias)) {
+                config.resolve.alias['tailwind-merge'] = path__default.default.join(tailwindMergeDistDir, '../bundle-mjs.mjs');
+            }
+        } catch  {
+        // tailwind-merge does not exist, do nothing
+        }
+        /**
+   * use-sync-external-store/shim optimization
+   *
+   * React 18 and above has built-in support for useSyncExternalStore,
+   * no need to include shim
+   */ try {
+            const reactPackageJson = globalRequire('react/package.json');
+            const reactVersion = reactPackageJson.version;
+            const majorVersion = Number.parseInt(reactVersion.split('.')[0], 10);
+            if (majorVersion >= 18 || majorVersion === 0 // experimental versions
+            ) {
+                config.resolve.alias ??= {};
+                if (!Array.isArray(config.resolve.alias)) {
+                    config.resolve.alias['use-sync-external-store/shim'] = 'react';
+                }
+            }
+        } catch  {
+        // react does not exist, do nothing
+        }
         return config;
     };
 
@@ -409,10 +447,7 @@ const loaders = ({ cwd, postcss, svgr, reactCompiler, webpackExperimentalBuiltin
                 },
                 {
                     test: /assets\//,
-                    type: 'asset/resource',
-                    generator: {
-                        filename: '_assets/[hash][ext][query]'
-                    }
+                    type: 'asset/resource'
                 }
             ]
         });
@@ -485,19 +520,21 @@ const loaders = ({ cwd, postcss, svgr, reactCompiler, webpackExperimentalBuiltin
     // };
     };
 
-const optimization = ({ development: isDevelopment, browserlists }, { supportedBrowsers })=>(config)=>{
+const optimization = ({ development: isDevelopment, browserlists, dropConsoleInProduction }, { supportedBrowsers })=>(config)=>{
         config.optimization ??= {};
         config.optimization.emitOnErrors = !isDevelopment;
         config.optimization.checkWasmTypes = false;
         config.optimization.nodeEnv = false; // we manually bring our own DefinePlugin
         config.optimization.minimizer ??= [];
-        config.optimization.minimizer.push(new TerserPlugin__default.default({
-            minify: TerserPlugin__default.default.swcMinify,
+        config.optimization.minimizer.push(new TerserWebpackPlugin__default.default({
+            minify: TerserWebpackPlugin__default.default.swcMinify,
             terserOptions: {
                 compress: {
                     ecma: 2018,
                     comparisons: false,
-                    inline: 2 // https://github.com/vercel/next.js/issues/7178#issuecomment-493048965
+                    inline: 2,
+                    // inline: 1,
+                    drop_console: isDevelopment ? false : dropConsoleInProduction
                 },
                 mangle: {
                     safari10: true
@@ -630,6 +667,7 @@ const splitChunks = ({ cwd, topLevelFrameworkPackages })=>(config)=>{
         plugins: [],
         dotenv: {},
         lodashTreeShaking: false,
+        dropConsoleInProduction: true,
         ...options
     };
     // dotenv

package/dist/index.d.ts

@@ -46,10 +46,12 @@ interface CreateWebpackOptions {
      * Path to HTML template file.
      *
      * This will be used by `html-webpack-plugin` to generate the final `index.html`.
+     * Default to `./src/index.html`, but you can set it to `null`, `undefined` or `false` to disable `html-webpack-plugin`.
      *
-     * If not specificied, the `html-webpack-plugin` will not be enabled
+     * @default './src/index.html'
+  
      */
-    htmlTemplatePath?: string;
+    htmlTemplatePath?: string | null | undefined | false;
     output?: {
         /**
          * `output.path`, where the built files will be emitted to.
@@ -199,6 +201,15 @@ interface CreateWebpackOptions {
      */
     plugins?: Configuration['plugins'];
     dotenv?: boolean | DotenvConfigOptions;
+    /**
+     * Remove all `console.*` calls in production build.
+     * Uses `swc` compiler's built-in capability to do so.
+     *
+     * If you need console statements in production, set this option to `false`.
+     *
+     * @default true
+     */
+    dropConsoleInProduction?: boolean;
     /**
      * By default we will use "browserlists" package to looking for config, like `.browserslistrc` file or `browserslist` field in `package.json`, etc.
      *

package/dist/index.mjs

@@ -17,11 +17,11 @@ import isCI from 'is-ci';
 import { confirm } from '@clack/prompts';
 import { installPackage } from '@antfu/install-pkg';
 import { castArray } from 'foxts/cast-array';
+import path from 'node:path';
 import LightningCSS, { browserslistToTargets } from 'lightningcss';
 import { defineReactCompilerLoaderOption, reactCompilerLoader } from 'react-compiler-webpack';
-import TerserPlugin from 'terser-webpack-plugin';
+import TerserWebpackPlugin from 'terser-webpack-plugin';
 import { LightningCssMinifyPlugin } from 'lightningcss-loader';
-import path from 'node:path';
 
 function getSupportedBrowsers(browserlists, dir, isDevelopment) {
     if (browserlists) {
@@ -273,6 +273,44 @@ const resolve = ({ cwd, lodashTreeShaking })=>async (config)=>{
                 config.resolve.fallback['lodash-es/fp'] = globalRequire.resolve('lodash/fp');
             }
         }
+        /**
+   * tailwind-merge optimization
+   *
+   * webpack do not repect the order in the `conditionNames` config
+   * instead, it prioritize the order in the `exports` field of package.json
+   *
+   * since tailwind-merge list its CommonJS export before ESM export, webpack will
+   * always piroritize CommonJS version.
+   *
+   * We can use alias to force webpack to use the ESM version
+   */ try {
+            const tailwindMergeDistDir = globalRequire.resolve('tailwind-merge');
+            config.resolve.alias ??= {};
+            if (!Array.isArray(config.resolve.alias)) {
+                config.resolve.alias['tailwind-merge'] = path.join(tailwindMergeDistDir, '../bundle-mjs.mjs');
+            }
+        } catch  {
+        // tailwind-merge does not exist, do nothing
+        }
+        /**
+   * use-sync-external-store/shim optimization
+   *
+   * React 18 and above has built-in support for useSyncExternalStore,
+   * no need to include shim
+   */ try {
+            const reactPackageJson = globalRequire('react/package.json');
+            const reactVersion = reactPackageJson.version;
+            const majorVersion = Number.parseInt(reactVersion.split('.')[0], 10);
+            if (majorVersion >= 18 || majorVersion === 0 // experimental versions
+            ) {
+                config.resolve.alias ??= {};
+                if (!Array.isArray(config.resolve.alias)) {
+                    config.resolve.alias['use-sync-external-store/shim'] = 'react';
+                }
+            }
+        } catch  {
+        // react does not exist, do nothing
+        }
         return config;
     };
 
@@ -393,10 +431,7 @@ const loaders = ({ cwd, postcss, svgr, reactCompiler, webpackExperimentalBuiltin
                 },
                 {
                     test: /assets\//,
-                    type: 'asset/resource',
-                    generator: {
-                        filename: '_assets/[hash][ext][query]'
-                    }
+                    type: 'asset/resource'
                 }
             ]
         });
@@ -469,19 +504,21 @@ const loaders = ({ cwd, postcss, svgr, reactCompiler, webpackExperimentalBuiltin
     // };
     };
 
-const optimization = ({ development: isDevelopment, browserlists }, { supportedBrowsers })=>(config)=>{
+const optimization = ({ development: isDevelopment, browserlists, dropConsoleInProduction }, { supportedBrowsers })=>(config)=>{
         config.optimization ??= {};
         config.optimization.emitOnErrors = !isDevelopment;
         config.optimization.checkWasmTypes = false;
         config.optimization.nodeEnv = false; // we manually bring our own DefinePlugin
         config.optimization.minimizer ??= [];
-        config.optimization.minimizer.push(new TerserPlugin({
-            minify: TerserPlugin.swcMinify,
+        config.optimization.minimizer.push(new TerserWebpackPlugin({
+            minify: TerserWebpackPlugin.swcMinify,
             terserOptions: {
                 compress: {
                     ecma: 2018,
                     comparisons: false,
-                    inline: 2 // https://github.com/vercel/next.js/issues/7178#issuecomment-493048965
+                    inline: 2,
+                    // inline: 1,
+                    drop_console: isDevelopment ? false : dropConsoleInProduction
                 },
                 mangle: {
                     safari10: true
@@ -616,6 +653,7 @@ __node_cjsModule.createRequire(import.meta.url);
         plugins: [],
         dotenv: {},
         lodashTreeShaking: false,
+        dropConsoleInProduction: true,
         ...options
     };
     // dotenv

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@corespeed/webpack",
-  "version": "0.1.0-beta.2",
+  "version": "0.1.0-beta.4",
   "description": "The opinionated webpack configuration for CoreSpeed projects.",
   "repository": {
     "type": "git",
@@ -32,7 +32,7 @@
     "@clack/prompts": "^0.11.0",
     "@pmmmwh/react-refresh-webpack-plugin": "^0.6.2",
     "@sentry/webpack-plugin": "^4.6.1",
-    "@swc/core": "^1.15.7",
+    "@swc/core": "^1.15.8",
     "@types/webpack-bundle-analyzer": "^4.7.0",
     "browserslist": "^4.28.1",
     "clean-webpack-plugin": "^4.0.0",
@@ -51,20 +51,20 @@
     "swc-loader": "^0.2.6",
     "terser-webpack-plugin": "^5.3.16",
     "tsconfig-paths-webpack-plugin": "^4.2.0",
-    "webpack-bundle-analyzer": "^5.1.0",
+    "webpack-bundle-analyzer": "^5.1.1",
     "webpackbar": "^7.0.0"
   },
   "devDependencies": {
     "@svgr/webpack": "^8.1.0",
     "@swc/types": "^0.1.25",
-    "@types/node": "^25.0.3",
+    "@types/node": "^25.0.6",
     "@types/webpack": "^5.28.5",
     "bumpp": "^10.3.2",
-    "bunchee": "^6.7.0",
+    "bunchee": "^6.9.3",
     "core-js": "^3.47.0",
     "eslint": "^9.39.2",
-    "eslint-config-sukka": "^8.0.6",
-    "eslint-formatter-sukka": "^8.0.6",
+    "eslint-config-sukka": "^8.1.0",
+    "eslint-formatter-sukka": "^8.1.0",
     "typescript": "^5.9.3",
     "webpack": "^5.104.1",
     "webpack-dev-server": "^5.2.2"