react 配置ant-Mobile

1、Ant Design Mobile中文文档

2、安装  
  npm install react-app-rewired customize-cra --save-dev

3，打开 package.json ，找见scripts  直接全部替换

/* package.json */
"scripts": {
   "start": "react-app-rewired start",
   "build": "react-app-rewired build",
   "test": "react-app-rewired test --env=jsdom",
}

4、然后在项目根目录创建一个 config-overrides.js 用于修改默认配置。

 直接粘贴到config-overrides.js就可以

const {
    override,
    fixBabelImports,
    addWebpackAlias,
    addDecoratorsLegacy,
} = require("customize-cra");
const path = require("path");
const rewirePostcss = require("react-app-rewire-postcss");
module.exports = override(
    // 配置按需加载
    fixBabelImports("import", {
        libraryName: "antd-mobile",
        style: "css",
    }),
    // 配置文件别名
    addWebpackAlias({
        "@": path.resolve(__dirname, "src"),
        "@scss": path.resolve(__dirname, "src/assets/scss"),
        "@images": path.resolve(__dirname, "src/assets/images"),
        "@views": path.resolve(__dirname, "src/views"),
        "@network": path.resolve(__dirname, "src/network"),
        "@store": path.resolve(__dirname, "src/store"),
        "@components": path.resolve(__dirname, "src/components"),
    }),
    addDecoratorsLegacy(),
    (config, env) => {
        // 重写postcss
        rewirePostcss(config, {
            plugins: () => [
                require("postcss-flexbugs-fixes"),
                require("postcss-preset-env")({
                    autoprefixer: {
                        flexbox: "no-2009",
                    },
                    stage: 3,
                }),
                require("postcss-px2rem-exclude")({
                    // 设计稿宽度/10
                    remUnit: 1080 / 10,
                    exclude: /node-modules/i,
                }),
            ],
        });
        return config;
    }
);

5、现在安装代码可能你看不懂，我也是根据提示，替大家踩坑了，大家可以直接下载

1、npm install babel-plugin-import --save-dev

2、npm i react-app-rewired start -D

3、npm start

 1、npm i react-scripts -D

2、npm i react-app-rewire-postcss -D

3、npm start

1、npm i postcss-px2rem-exclude -S

2、npm start

然后好了