Loaders

Loaders are transformations that are applied to the source code of a module.

Typescript and Javascript using swc-loader

See swc for more documentation

Installation

pnpm i -D @swc/core swc-loader

Usage

webpack.config.js

module: {
    rules: [
        {
            test: /\.tsx?$/,
            exclude: /node_modules/,
            use: {
                // `.swcrc` can be used to configure swc
                loader: "swc-loader",
            },
        },
    ];
}

The jsc.transform.react.development option is automatically set based on the webpack mode.

• Offical Docs
• React fast refresh

CSS using styled-loader and css-loader

Installation

pnpm i -D style-loader css-loader

Usage

webpack.config.js

module: {
    rules: [
        {
            test: /\.css$/,
            use: ["style-loader", "css-loader"],
        },
    ],
}

---

Last update: August 12, 2023
Created: May 27, 2023