I created a react project using the react-create-app scaffolding tool. When I used the react-create-app scaffold tool, I found that the project started with errors

 Support for the experimental syntax 'decorators-legacy' isn't currently enabled
Copy the code

A few kinds of method of Internet Baidu have tried, do not work, oneself discovered accidentally

My own is react-scripts

What’s ok in the video is react-app-rewired

React-app-rewired problem solving, for learning react on the same way to give a reference




The React project uses React-app-Rewired to implement on-demand packaging

Because the creative-React-app scaffolding tool already encapsulates webPack, it’s not easy to configure.babelrc files the way it’s normally implemented

{" plugins ": [[" import" {" libraryName ":" antd ", / / to be on-demand packaged libraries "libraryDirectory" : "es", "style" : "CSS"}]]}Copy the code

So, we have to use the React-app-rewired package, which is an extension of the React-Scripts

// CNPM I babel-plugin-import react-app-rewired -D // CNPM I babel-plugin-import react-app-rewired -D React-app-rewired "build": "react-app-rewired build", "test": "react-app-rewired test", "eject": "react-app-rewired eject" }, Const {injectBabelPlugin} = require('react-app-rewired'); module.exports = function override(config, env) { config = injectBabelPlugin(['import', {libraryName: 'antd', style: 'css'}], config); return config; };Copy the code

If the top does not work, refer to the bottom

Because the [email protected]’ll also need to install customize-cra.

const { override, fixBabelImports } = require('customize-cra');
  module.exports = override(
  fixBabelImports('import', {
  libraryName: 'antd-mobile',
  style: 'css',
  }),
);
Copy the code

With reference to