【React】配置 Alias 别名

最新推荐文章于 2025-05-03 08:15:00 发布

zoe驿鹿

最新推荐文章于 2025-05-03 08:15:00 发布

阅读量1.8k

点赞数

分类专栏： React webpack 文章标签： react alias webpack customize-cra

本文链接：https://blog.youkuaiyun.com/webFrontEndDev/article/details/108387191

版权

React 同时被 2 个专栏收录

4 篇文章

订阅专栏

webpack

2 篇文章

订阅专栏

本文介绍如何在React项目中使用customize-cra自定义Webpack配置，通过创建config-overrides.js文件并设置别名，实现对项目目录结构的优化。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在src根目录新建config-overrides.js自定义webpack配置。

安装 customize-cra

npm install customize-cra

const { override, addWebpackAlias } = require('customize-cra');
const path = require('path')

module.exports = override(  
  addWebpackAlias({
    '@': path.resolve(__dirname, './src'),
    '@components': path.resolve(__dirname, './src/components'),
    '@utils': path.resolve(__dirname, './src/utils'),
  })
);