Low-Level Tools#

Usage#

Modern.js internally integrates tools such as Babel, TypeScript, Webpack, PostCSS, Tailwind CSS by default.

Usually, the default configuration can meet most development needs. When there are special needs, it can be achieved through the underlying configuration.

Take configuring Webpack as an example, just add tools.webpack to the modern.config.ts:

export default defineConfig({
  tools: {
    webpack: config => {},
  },
});

Configurations in the tools can be set to Object or Function.

When the value is Object, it will be merged with the default configuration. For the specific merging strategy, refer to the configuration options document (see table below).

When the value is Function, the first parameter is the default configuration value. You can directly modify this object without returning it, or you can return a new object or a merged object as the final result.

Low-level Configuration Details#

Currently provided is as follows: