react-learning

My personal React playground

• Redux Toolkit
• Webpack config in TS
• CSS Modules
• New JSX Transform

Webpack config in TS

To use Webpack config in TS and have "module": "esnext" you need to add in tsconfig.json

"ts-node": {
    "compilerOptions": {
      "module": "commonjs"
    }
},

CSS Modules

Had to define typings for it fo work in TS

declare module '*.scss';

Issues with webpack v5

1/ Starts requiring fully specified paths and some modules (like Ant Design) might not have it.

Fixed by adding this to the rules

{
    test: /\.m?js/,
    resolve: {
        fullySpecified: false,
    },
},

2/ Types might not be correct as a lot of modules still use @types/webpack - webpack v5 makes its own types now