react 使用绝对路径引入文件---@

1、下载依赖:

npm  i  customize-cra  react-app-rewired  -S
npm  i  babel-plugin-import  -S

2、在 src目录下新建config-overrides.js文件：

const { override, fixBabelImports, addWebpackAlias } = require('customize-cra')
const path = require('path')
 
module.exports = override(
    // 针对 antd 实现按需打包，根据 import 来打包(使用 babel-plugin-import)
    fixBabelImports('import', {
        libraryName: 'antd',
        libraryDirectory: 'es',
        style: 'css'
    }),
    addWebpackAlias({
        ['@']: path.resolve(__dirname, 'src')
    })
)

3、修改package.json:

"scripts": {
   "start": "set PORT=9000 && react-app-rewired start",
   "build": "react-app-rewired build",
   "test": "react-app-rewired test",
   "eject": "react-scripts eject"
},

---

总结：

set PORT=9000 可以自定义端口号。