在VScode中配置@路径提示
配置原因:在使用vue-cli开发过程中,由于在输入路径的时候没有提示,既影响开发的速度,又无法判断输入的路径是否正确,因此我们可以在vscode中配置@路径提示配置方法:1、在使用webpack工具进行项目的开发时(目前已经很少用到)@默认指向的就是 src目录这个配置的意思就是 @ 代表的就是 src这个目录在webpack.config.js文件中配置如下程序module.exports =
·
配置原因:
在使用vue-cli开发(或者webpack工具开发)过程中,由于在输入路径的时候没有提示,既影响开发的速度,又无法判断输入的路径是否正确,因此我们可以在vscode中配置@路径提示
配置方法:
1、在使用webpack工具进行项目的开发时(目前已经很少用到)
@默认指向的就是 src目录
这个配置的意思就是 @ 代表的就是 src这个目录
在webpack.config.js文件中配置如下程序
module.exports ={
resolve: {
alias: {
// 告诉 webpack,程序员写的代码中,@ 符号表示 src 这一层目录
'@': path.join(__dirname, './src/')
}
}
}
2、在使用vue-cli(脚手架)进行项目的开发时(vue项目使用)
第一步:先安装插件 Path Autocomplete 插件
第二步:安装成功后,在settings.json文件中配置文件
settings.json文件在 左上角-文件-首选项-设置-应用程序-设置同步 里面
也可点击设置中的符号
第三步:将以下代码复制到settings.json的括号中的第一行就可以了
//导入文件时是否携带文件的扩展名
"path-autocomplete.extensionOnlmport": true,
//配置@的路径提示
"path-autocomplete.pathMappings": {
"@": "${folder}/src"
},
重启vscode,这样@路径提示就配置好了
注意:开发的那个项目,就定位到那个项目,然后用vscode打开。(不要有与这个项目无关的文件),不然@路径提示将失效
如果有问题,欢迎大家评论区讨论,文章对你有用,给正在学习前端的小陈点个赞吧~~~
更多推荐
已为社区贡献6条内容
所有评论(0)