我是靠谱客的博主 犹豫路灯,最近开发中收集的这篇文章主要介绍在react内配置@符号,觉得挺不错的,现在分享给大家,希望可以做个参考。

概述

前言

  1. 想要在react中使用@符号,我们需要分两步进行,第一步就是让VsCode识别@符号,第二步是让webpag识别

    让vscode识别,在你的项目根目录中创建一个jsconfig.json文件

{
"compilerOptions": {
"baseUrl": "./",
"paths": {
"@/*": ["src/*"]
}
}
}

注意:此时代码会报错,提示@符号无法识别,当然,这不是vscode本身报错,而是webpag无法识别,我们接下来就想办法让webpag识别

2.让webpag识别 ,

  • 下载craco
npm i -D @craco/craco
  • 在项目根目录下创建一个craco.config.js文件
  • 在pakage.json中修改读取方式
  • 里面代码如下

craco.config.js文件

const path = require('path')
module.exports = {
webpack: {
alias: {
'@': path.join(__dirname, 'src')
}
}
}

pakage.json文件

"scripts": {
"start": "craco start",
"build": "craco build",
"test": "craco test",
"eject": "react-scripts eject"
},

最后再把代码跑起来,这样就可以在react内使用@标识符了

最后

以上就是犹豫路灯为你收集整理的在react内配置@符号的全部内容,希望文章能够帮你解决在react内配置@符号所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(54)

评论列表共有 0 条评论

立即
投稿
返回
顶部