Upgrade react-scripts to v5, Support Webpack 5.x

[jaywcjlove]

Upgrade react-scripts to v5

• @kkt/ncc: $RefreshSig$ is not defined #357
• Error: Cannot find module 'ajv/dist/compile/codegen'  #350
• WARNING in DefinePlugin Conflicting values for 'process.env.NODE_ENV' #347
• TypeError: MiniCssExtractPlugin is not a constructor #340
• Critical dependency: the request of a dependency is an expression #336
• Error: You forgot to add 'mini-css-extract-plugin' plugin #334
• Inline JavaScript is not enabled. Is it set in your options antdpro/antdp#170
• Startup service stuck #330 🚧
• sourceMap source file does not exist #325
• Error: true is not a PostCSS plugin #324
• Build load *module.less, shows resolve-url-loader warning #313
• lerna bootstrap --hoist doesn't work with create-react-app 5 #305
• Webpack 5 facebook/create-react-app#11201
• BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default #412
• Failed to parse source map from #446

• Migrate from kkt 5.x to 6.x.
• Migrate from kkt 4.x to 5.x.

• Hooks + multiple instances of React facebook/react#13991 (comment)

.kktrc.ts

import webpack, { Configuration } from 'webpack';
import { LoaderConfOptions } from 'kkt';
import { mdCodeModulesLoader } from 'markdown-react-code-preview-loader';
import lessModules from '@kkt/less-modules';
import scopePluginOptions from '@kkt/scope-plugin-options';
import pkg from './package.json';
import path from 'path';

export default (conf: Configuration, env: 'development' | 'production', options: LoaderConfOptions) => {
  conf = lessModules(conf, env, options);
  // Get the project version.
  conf.plugins!.push(
    new webpack.DefinePlugin({
      VERSION: JSON.stringify(pkg.version),
    }),
  );
  // https://github.com/kktjs/kkt/issues/336#issue-1097660932
  conf.module!.exprContextCritical = false;

  conf = scopePluginOptions(conf, env, {
    ...options,
    allowedPaths: [
+      path.resolve(process.cwd(), './node_modules/')
    ]
  });
  /**
   * https://github.com/facebook/react/issues/13991#issuecomment-435587809
   * https://legacy.reactjs.org/warnings/invalid-hook-call-warning.html#duplicate-react
   */
+  if (conf.resolve?.alias) {
+    conf.resolve.alias = {
+      ...conf.resolve.alias,
+      react: path.resolve('./node_modules/react'),
+      'react-dom': path.resolve('./node_modules/react-dom')
+    };
+  }
  conf = mdCodeModulesLoader(conf);
  if (env === 'production') {
    conf.output = { ...conf.output, publicPath: './' };
  }
  return conf;
};

[jaywcjlove]

e3ac95f
f2a4433
36eb963

[jaywcjlove]

TypeError: Cannot read property 'javascript' of undefined
webpack-contrib/terser-webpack-plugin#339