在create-react-app中craco配置less及alias后路径跳转问题

最新推荐文章于 2024-03-25 20:42:00 发布

mus_木司

最新推荐文章于 2024-03-25 20:42:00 发布

阅读量2.2k

点赞数

分类专栏：前端文章标签： craco less alias vscode

本文链接：https://blog.csdn.net/mus123/article/details/115405326

版权

本文介绍了在使用create-react-app并配置craco、less及alias后，解决Visual Studio Code（VSCode）中路径跳转问题的方法。通过创建craco.config.js进行alias配置，更新package.json的scripts，创建jsconfig.json，以及调整VSCode的设置，包括安装特定插件和修改setting.json，最终实现了代码的正确跳转。

摘要由CSDN通过智能技术生成

首先是配置alias
https://www.jianshu.com/p/7e1f1e535b8c介绍了如何配置cra的antd的less形式以及babel-plugin-import按需加载

 yarn add antd @craco/craco craco-less @babel/plugin-proposal-decorators babel-plugin-import -D

根目录下创建 craco.config.js

const CracoLessPlugin = require('craco-less')
const path = require('path')

const pathResolve = pathUrl => path.join(__dirname, pathUrl)

module.exports = {
   
  webpack: {
   
    alias: {
   
      '@@': pathResolve('.'),
      '@': pathResolve('src'),
    }
  }