Rspack provides configurations similar to webpack. This chapter will show you how to use the Rspack configuration.
When you run the Rspack CLI, Rspack automatically reads the rspack.config.js
file in the current working directory.
A basic Rspack configuration file looks like this:
Rspack supports four types of configuration files, .js
, .ts
, .cjs
and .mjs
formats.
rspack.config.js
: defaults to CommonJS
format, or ES Module
format if the type of the package.json is module.rspack.config.ts
: TypeScript
format, which is compiled internally to .js
format using ts-node
.rspack.config.cjs
: Forced to CommonJS
format.rspack.config.mjs
: Forced to ES module
format.See ES Module and CommonJS for the difference between CommonJS
and ES Module
rspack.config.js
is a JavaScript file, you can use JSDoc to enable the IDE's Intellisense and TypeScript type checking.
Alternatively, you can use the defineConfig
helper, which provides auto-completion of the configuration:
Alternatively, you can use TypeScript as configuration file. The default TypeScript configuration file name is rspack.config.ts
.
You need to install ts-node
as devDependencies
so that Rspack can resolve the ts
extension.
If the version of Node.js you are using supports the --experimental-transform-types flag, you can use the built-in TS transformation of Node.js without needing to install ts-node
.
Note that Rspack will first search JavaScript and then TypeScript if the JS file does not exist.
You can specify the name of the configuration file using the --config
option.
For example, if you need to use the rspack.prod.config.js
file when running build, you can add the following scripts to package.json
:
You can also abbreviate the --config
option to -c
:
Rspack supports exporting a function in rspack.config.js
, you can dynamically compute the configuration in the function and return it to Rspack.
As you can see from the example above, the function takes two input parameters:
env
, which corresponds to the value of the --env
option when running the CLI command.argv
, which contains all the options passed to the CLI.In addition to passing the env
parameter, it is more common to use process.env.NODE_ENV
to determine the current environment:
You can use the merge
function exported by webpack-merge
to merge multiple configurations.
For more information of merge
, please refer to webpack-merge documentation.