[heft-rspack-plugin] Initial implementation of a Rspack Heft plugin.

README.md

@@ -187,6 +187,7 @@ These GitHub repositories provide supplementary resources for Rush Stack:
 | [/build-tests/heft-node-everything-test](./build-tests/heft-node-everything-test/) | Building this project tests every task and config file for Heft when targeting the Node.js runtime |
 | [/build-tests/heft-parameter-plugin](./build-tests/heft-parameter-plugin/) | This project contains a Heft plugin that adds a custom parameter to built-in actions |
 | [/build-tests/heft-parameter-plugin-test](./build-tests/heft-parameter-plugin-test/) | This project exercises a built-in Heft action with a custom parameter |
+| [/build-tests/heft-rspack-everything-test](./build-tests/heft-rspack-everything-test/) | Building this project tests every task and config file for Heft when targeting the web browser runtime using Rspack |
 | [/build-tests/heft-sass-test](./build-tests/heft-sass-test/) | This project illustrates a minimal tutorial Heft project targeting the web browser runtime |
 | [/build-tests/heft-swc-test](./build-tests/heft-swc-test/) | Building this project tests building with SWC |
 | [/build-tests/heft-typescript-composite-test](./build-tests/heft-typescript-composite-test/) | Building this project tests behavior of Heft when the tsconfig.json file uses project references. |
@@ -212,6 +213,7 @@ These GitHub repositories provide supplementary resources for Rush Stack:
 | [/build-tests/set-webpack-public-path-plugin-test](./build-tests/set-webpack-public-path-plugin-test/) | Building this project tests the set-webpack-public-path-plugin |
 | [/build-tests/webpack-local-version-test](./build-tests/webpack-local-version-test/) | Building this project tests the rig loading for the local version of webpack |
 | [/eslint/local-eslint-config](./eslint/local-eslint-config/) | An ESLint configuration consumed projects inside the rushstack repo. |
+| [/heft-plugins/heft-rspack-plugin](./heft-plugins/heft-rspack-plugin/) | Heft plugin for Rspack |
 | [/libraries/rush-themed-ui](./libraries/rush-themed-ui/) | Rush Component Library: a set of themed components for rush projects |
 | [/libraries/rushell](./libraries/rushell/) | Execute shell commands using a consistent syntax on every platform |
 | [/repo-scripts/doc-plugin-rush-stack](./repo-scripts/doc-plugin-rush-stack/) | API Documenter plugin used with the rushstack.io website |

build-tests-samples/heft-storybook-react-tutorial/webpack.config.js

@@ -13,7 +13,7 @@ function createWebpackConfig({ production }) {
     // Documentation: https://webpack.js.org/configuration/mode/
     mode: production ? 'production' : 'development',
     resolve: {
-      extensions: ['.js', '.jsx', '.json']
+      extensions: ['.js', '.json']
     },
     module: {
       rules: [

build-tests-samples/heft-webpack-basic-tutorial/webpack.config.js

@@ -12,7 +12,7 @@ function createWebpackConfig({ production }) {
     // Documentation: https://webpack.js.org/configuration/mode/
     mode: production ? 'production' : 'development',
     resolve: {
-      extensions: ['.js', '.jsx', '.json']
+      extensions: ['.js', '.json']
     },
     module: {
       rules: [

build-tests/heft-rspack-everything-test/config/heft.json

@@ -0,0 +1,66 @@
+/**
+ * Defines configuration used by core Heft.
+ */
+{
+  "$schema": "https://developer.microsoft.com/json-schemas/heft/v0/heft.schema.json",
+
+  // TODO: Add comments
+  "phasesByName": {
+    "build": {
+      "cleanFiles": [{ "includeGlobs": ["dist", "lib", "lib-commonjs"] }],
+
+      "tasksByName": {
+        "typescript": {
+          "taskPlugin": {
+            "pluginPackage": "@rushstack/heft-typescript-plugin"
+          }
+        },
+        "lint": {
+          "taskDependencies": ["typescript"],
+          "taskPlugin": {
+            "pluginPackage": "@rushstack/heft-lint-plugin"
+          }
+        },
+        "rspack": {
+          "taskDependencies": ["typescript"],
+          "taskPlugin": {
+            "pluginPackage": "@rushstack/heft-rspack-plugin"
+          }
+        }
+      }
+    },
+
+    "test": {
+      "phaseDependencies": ["build"],
+      "tasksByName": {
+        "jest": {
+          "taskPlugin": {
+            "pluginPackage": "@rushstack/heft-jest-plugin"
+          }
+        }
+      }
+    },
+
+    "trust-dev-cert": {
+      "tasksByName": {
+        "trust-dev-cert": {
+          "taskPlugin": {
+            "pluginPackage": "@rushstack/heft-dev-cert-plugin",
+            "pluginName": "trust-dev-certificate-plugin"
+          }
+        }
+      }
+    },
+
+    "untrust-dev-cert": {
+      "tasksByName": {
+        "untrust-dev-cert": {
+          "taskPlugin": {
+            "pluginPackage": "@rushstack/heft-dev-cert-plugin",
+            "pluginName": "untrust-dev-certificate-plugin"
+          }
+        }
+      }
+    }
+  }
+}

build-tests/heft-rspack-everything-test/config/jest.config.json

@@ -0,0 +1,12 @@
+{
+  "extends": "@rushstack/heft-jest-plugin/includes/jest-web.config.json",
+
+  // Enable code coverage for Jest
+  "collectCoverage": true,
+  "coverageDirectory": "<rootDir>/coverage",
+  "coverageReporters": ["cobertura", "html"],
+
+  // Use v8 coverage provider to avoid Babel
+  "coverageProvider": "v8",
+  "resolver": "@rushstack/heft-jest-plugin/lib/exports/jest-node-modules-symlink-resolver"
+}

build-tests/heft-rspack-everything-test/config/rush-project.json

@@ -0,0 +1,14 @@
+{
+  "$schema": "https://developer.microsoft.com/json-schemas/rush/v5/rush-project.schema.json",
+
+  "operationSettings": [
+    {
+      "operationName": "_phase:build",
+      "outputFolderNames": ["lib", "dist"]
+    },
+    {
+      "operationName": "_phase:test",
+      "outputFolderNames": ["coverage"]
+    }
+  ]
+}

build-tests/heft-rspack-everything-test/config/typescript.json

@@ -0,0 +1,55 @@
+/**
+ * Configures the TypeScript plugin for Heft.  This plugin also manages linting.
+ */
+{
+  "$schema": "https://developer.microsoft.com/json-schemas/heft/v0/typescript.schema.json",
+
+  /**
+   * If provided, emit these module kinds in addition to the modules specified in the tsconfig.
+   * Note that this option only applies to the main tsconfig.json configuration.
+   */
+  "additionalModuleKindsToEmit": [
+    // {
+    //   /**
+    //    * (Required) Must be one of "commonjs", "amd", "umd", "system", "es2015", "esnext"
+    //    */
+    //  "moduleKind": "amd",
+    //
+    //   /**
+    //    * (Required) The name of the folder where the output will be written.
+    //    */
+    //    "outFolderName": "lib-amd"
+    // }
+    {
+      "moduleKind": "commonjs",
+      "outFolderName": "lib-commonjs"
+    }
+  ],
+
+  /**
+   * Describes the way files should be statically coped from src to TS output folders
+   */
+  "staticAssetsToCopy": {
+    /**
+     * File extensions that should be copied from the src folder to the destination folder(s).
+     */
+    "fileExtensions": [".css", ".png"]
+
+    /**
+     * Glob patterns that should be explicitly included.
+     */
+    // "includeGlobs": [
+    //   "some/path/*.js"
+    // ],
+
+    /**
+     * Glob patterns that should be explicitly excluded. This takes precedence over globs listed
+     * in "includeGlobs" and files that match the file extensions provided in "fileExtensions".
+     */
+    // "excludeGlobs": [
+    //   "some/path/*.css"
+    // ]
+  },
+
+  "onlyResolveSymlinksInNodeModules": true
+}

build-tests/heft-rspack-everything-test/eslint.config.js

@@ -0,0 +1,16 @@
+// Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license.
+// See LICENSE in the project root for license information.
+
+const webAppProfile = require('local-eslint-config/flat/profile/web-app');
+
+module.exports = [
+  ...webAppProfile,
+  {
+    files: ['**/*.ts', '**/*.tsx'],
+    languageOptions: {
+      parserOptions: {
+        tsconfigRootDir: __dirname
+      }
+    }
+  }
+];

build-tests/heft-rspack-everything-test/package.json

@@ -0,0 +1,29 @@
+{
+  "name": "heft-rspack-everything-test",
+  "description": "Building this project tests every task and config file for Heft when targeting the web browser runtime using Rspack",
+  "version": "1.0.0",
+  "private": true,
+  "scripts": {
+    "build": "heft build --clean",
+    "start": "heft build-watch",
+    "serve": "heft build-watch --serve",
+    "_phase:build": "heft run --only build -- --clean",
+    "_phase:test": "heft run --only test -- --clean"
+  },
+  "devDependencies": {
+    "@rushstack/heft-dev-cert-plugin": "workspace:*",
+    "@rushstack/heft-jest-plugin": "workspace:*",
+    "@rushstack/heft-lint-plugin": "workspace:*",
+    "@rushstack/heft-typescript-plugin": "workspace:*",
+    "@rushstack/heft-rspack-plugin": "workspace:*",
+    "@rushstack/heft": "workspace:*",
+    "@rushstack/node-core-library": "workspace:*",
+    "@rushstack/rush-sdk": "workspace:*",
+    "@types/heft-jest": "1.0.1",
+    "@types/node": "20.17.19",
+    "eslint": "~9.37.0",
+    "local-eslint-config": "workspace:*",
+    "typescript": "~5.8.2",
+    "@rspack/core": "~1.6.0-beta.0"
+  }
+}

build-tests/heft-rspack-everything-test/rspack.config.mjs

@@ -0,0 +1,51 @@
+// @ts-check
+/** @typedef {import('@rushstack/heft-rspack-plugin').IRspackConfiguration} IRspackConfiguration */
+'use strict';
+
+import { dirname, resolve } from 'node:path';
+import { fileURLToPath } from 'node:url';
+import { HtmlRspackPlugin, SwcJsMinimizerRspackPlugin } from '@rspack/core';
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = dirname(__filename);
+
+/** @type {IRspackConfiguration} */
+const config = {
+  mode: 'production',
+  module: {
+    rules: [
+      {
+        test: /\.png$/i,
+        type: 'asset/resource'
+      },
+      {
+        test: /\.js$/,
+        enforce: 'pre'
+        // TODO: enable after rspack drops a new version with this commit https://github.com/web-infra-dev/rspack/commit/d31f2fa07179d72eee99b21db517946d08073767
+        // extractSourceMap: true
+      }
+    ]
+  },
+  target: ['web', 'es2020'],
+  resolve: {
+    extensions: ['.js', '.json']
+  },
+  entry: {
+    'heft-test-A': resolve(__dirname, 'lib', 'indexA.js'),
+    'heft-test-B': resolve(__dirname, 'lib', 'indexB.js')
+  },
+  output: {
+    path: resolve(__dirname, 'dist'),
+    filename: '[name]_[contenthash].js',
+    chunkFilename: '[id].[name]_[contenthash].js',
+    assetModuleFilename: '[name]_[contenthash][ext][query]'
+  },
+  devtool: 'source-map',
+  optimization: {
+    minimize: true,
+    minimizer: [new SwcJsMinimizerRspackPlugin({})]
+  },
+  plugins: [new HtmlRspackPlugin()]
+};
+
+export default config;

build-tests/heft-rspack-everything-test/rspack.dev.config.mjs

@@ -0,0 +1,45 @@
+// @ts-check
+/** @typedef {import('@rushstack/heft-rspack-plugin').IRspackConfiguration} IRspackConfiguration */
+'use strict';
+
+import { dirname, resolve } from 'node:path';
+import { fileURLToPath } from 'node:url';
+import { HtmlRspackPlugin } from '@rspack/core';
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = dirname(__filename);
+
+/** @type {IRspackConfiguration} */
+const config = {
+  mode: 'none',
+  module: {
+    rules: [
+      {
+        test: /\.png$/i,
+        type: 'asset/resource'
+      }
+    ]
+  },
+  target: ['web', 'es2020'],
+  resolve: {
+    extensions: ['.js', '.json']
+  },
+  entry: {
+    'heft-test-A': resolve(__dirname, 'lib', 'indexA.js'),
+    'heft-test-B': resolve(__dirname, 'lib', 'indexB.js')
+  },
+  output: {
+    path: resolve(__dirname, 'dist'),
+    filename: '[name]_[contenthash].js',
+    chunkFilename: '[id].[name]_[contenthash].js',
+    assetModuleFilename: '[name]_[contenthash][ext][query]'
+  },
+  devtool: 'source-map',
+  optimization: {
+    minimize: false,
+    minimizer: []
+  },
+  plugins: [new HtmlRspackPlugin()]
+};
+
+export default config;

build-tests/heft-rspack-everything-test/src/chunks/ChunkClass.ts

@@ -0,0 +1,14 @@
+// Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license.
+// See LICENSE in the project root for license information.
+
+export class ChunkClass {
+  public doStuff(): void {
+    // eslint-disable-next-line no-console
+    console.log('CHUNK');
+  }
+
+  public getImageUrl(): string {
+    // eslint-disable-next-line @typescript-eslint/no-require-imports
+    return require('./image.png');
+  }
+}

build-tests/heft-rspack-everything-test/src/chunks/image.d.png.ts

@@ -0,0 +1,6 @@
+// Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license.
+// See LICENSE in the project root for license information.
+
+declare const path: string;
+
+export default path;

build-tests/heft-rspack-everything-test/src/copiedAsset.css

@@ -0,0 +1 @@
+/* THIS FILE SHOULD GET COPIED TO THE "lib" FOLDER BECAUSE IT IS REFERENCED IN copy-static-assets.json */

build-tests/heft-rspack-everything-test/src/indexA.ts

@@ -0,0 +1,10 @@
+/* eslint-disable */
+/* tslint:disable */
+import(/* webpackChunkName: 'chunk' */ './chunks/ChunkClass')
+  .then(({ ChunkClass }) => {
+    const chunk: any = new ChunkClass();
+    chunk.doStuff();
+  })
+  .catch((e) => {
+    console.log('Error: ' + e.message);
+  });

build-tests/heft-rspack-everything-test/src/indexB.ts

@@ -0,0 +1,5 @@
+// Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license.
+// See LICENSE in the project root for license information.
+
+// eslint-disable-next-line no-console
+console.log('dostuff');

build-tests/heft-rspack-everything-test/src/test/ExampleTest.test.ts

@@ -0,0 +1,16 @@
+// Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license.
+// See LICENSE in the project root for license information.
+
+import { ChunkClass } from '../chunks/ChunkClass';
+
+describe('Example Test', () => {
+  it('Correctly tests stuff', () => {
+    expect(true).toBeTruthy();
+  });
+
+  it('Correctly handles images', () => {
+    const chunkClass: ChunkClass = new ChunkClass();
+    expect(() => chunkClass.getImageUrl()).not.toThrow();
+    expect(typeof chunkClass.getImageUrl()).toBe('string');
+  });
+});

build-tests/heft-rspack-everything-test/src/test/Image.test.ts

@@ -0,0 +1,10 @@
+// Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license.
+// See LICENSE in the project root for license information.
+
+import image from '../chunks/image.png';
+
+describe('Image Test', () => {
+  it('correctly handles urls for images', () => {
+    expect(image).toBe('lib-commonjs/chunks/image.png');
+  });
+});