react配置 src 根路径

前提:react配置导入根路径需要在webpack中配置,但使用脚手架创建的项目,默认将babelwebpack等内容全部封装到react-scripts中,所以在这种状态下没有办法更改webpack中的内容

需要执行npm run eject解开react-scripts

  • npm run eject 命令无法撤销
  • 执行后,会出现config 和scripts 两个文件夹

方法:在新出现的config 文件夹中,找到 webpack.config.js 文件,在alias 中插入'@': path.resolve('src'),/或者 '@':path.join(__dirname,'../src'), 就可以了

 1 alias: {
 2         '@': path.resolve('src'),
 3         // '@':path.join(__dirname,'../src'),
 4         // Support React Native Web
 5         // https://www.smashingmagazine.com/2016/08/a-glimpse-into-the-future-with-react-native-for-web/
 6         'react-native': 'react-native-web',
 7         // Allows for better profiling with ReactDevTools
 8         ...(isEnvProductionProfile && {
 9           'react-dom$': 'react-dom/profiling',
10           'scheduler/tracing': 'scheduler/tracing-profiling',
11         }),
12         ...(modules.webpackAliases || {}),
13       },
原文地址:https://www.cnblogs.com/shun1015/p/13520148.html