react项目添加webpack别名

最新推荐文章于 2024-06-13 11:51:08 发布

原创最新推荐文章于 2024-06-13 11:51:08 发布 · 329 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#前端 #reactjs #webpack

react 同时被 2 个专栏收录

14 篇文章

订阅专栏

webpack

8 篇文章

订阅专栏

本文介绍如何使用 CRACO 进行项目配置，包括设置别名路径以简化文件引用，通过 craco.config.js 文件定义了多个常用目录的路径映射。

项目配置 @craco/craco ，可参考博客

craco.config.js添加如下配置

// 顶部引入path
const path = require("path");


module.exports = {

  ...

  webpack: {
    alias: {
      "@": path.resolve(__dirname, 'src'),
      "@a": path.resolve(__dirname, 'src/assets'),
      "@c": path.resolve(__dirname, 'src/components'),
      "@v": path.resolve(__dirname, 'src/views'),
      "@apis": path.resolve(__dirname, 'src/services/apis/index.js'),
    },
  }

  ...

}