配置vscode支持webpack的alias

vscode确实是比较好的编辑器
其中一个比较好的插件就是path autocomplete,但是这里有个问题,当通过webpack的alias引用的时候,path autocomplete是不起作用的

import sss from "@common/"

然后后面也没有路径提示,自己手动写好他妈的烦
后来查了下,需要在项目跟路径下配置一个jsconfig.json,让vscode能够识别出alias
废话不多说,
webpack配置

resolve: {
        alias: {
          "@actions": `${this.srcPathAbsolute}/actions/`,
          "@components": `${this.srcPathAbsolute}/components/`,
          "@commonComp": `${this.srcPathAbsolute}/components/common/`,
          "@common": `${this.srcPathAbsolute}/common/`
    }
}

jsconfig.json的配置

{
  "compilerOptions": {
    "target": "es2017",
    "allowSyntheticDefaultImports": false,
    "baseUrl": "./",
    "paths": {
      "@actions/*": ["src/actions/*"],
      "@components/*": ["src/components/"],
      "@commonComp/*": ["src/components/common/"],
      "@common/*": ["src/common/*"],
      "@reducers/*": ["src/reducers/*"],
      "@images/*": ["src/images/*"],
      "@lib/*": ["src/lib/*"],
      "@assets/*": ["src/assets/*"],
      "@util/*": ["src/utility/*"],
      "config/*": ["src/config/*"],
      "sources/*": ["src/sources/*"],
      "stores/*": ["src/stores/*"],
      "styles/*": ["src/styles/*"]
    }
  },
  "exclude": ["node_modules", "dist"],
  "include": ["src"]
}

这样在你引入路径的时候,如果使用webpack的alias的时候,就可以自动提示路径了

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 1 Webpack 1.1 概念简介 1.1.1 WebPack是什么 1、一个打包工具 2、一个模块加载工具 3...
    Kevin_Junbaozi阅读 11,771评论 0 16
  • 第一部分:概念 概念 webpack 是一个现代的 JavaScript 应用程序的模块打包器(module bu...
    吴佳浩阅读 8,204评论 0 2
  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 135,803评论 19 139
  • 文/以鱼为煮 正值夏令时节,大自然赋予人类无穷的馈赠。很多人都按时按地规划着日程,就只为...
    以鱼为煮阅读 4,229评论 3 30
  • 今日继续翻看贾平凹的自在独行,有几句写的特别好,关于孤独,他这么说: 好多人在说自己孤独,说自己孤独的人其实并...
    本天才传说阅读 2,241评论 0 0

友情链接更多精彩内容