脚本宝典收集整理的这篇文章主要介绍了

不再手写import – VSCode自动引入Vue组件和Js模块

脚本宝典小编觉得挺不错的,现在分享给大家,也给大家做个参考,希望能帮助你少写一行代码,多一份安全和惬意。

如要自动引入Vue组件,首先需安装VSCode拓展: Vetur

自动引入Vue组件和普通Js模块

在根目录添加 jsconfig.json
每次修改jsconfig.json后需重启该VSCode窗口

{
  "include": [
    "./src/**/*"
  ],
}

不再手写import – VSCode自动引入Vue组件和Js模块-脚本宝典

支持Webpack别名路径

同上,需更新 jsconfig.json

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

不再手写import – VSCode自动引入Vue组件和Js模块-脚本宝典

在JS中自动引入node_modules中的JS

  1. lodahs为例,安装 lodash: npm install lodash
  2. 在根目录添加 jsconfig.json
{
  "compilerOptions": {
    "checkJs": true,
  },
  "include": [
    "node_modules/lodash/*"
  ],
}
  1. 输入关键字后,点击提示灯泡(快键键: Ctrl/Command + .),选择JS模块

注意: checkJs可能会引起部分项目语法报错,如有报错可使用下面的方法作为替代方案。

使用Npm Intellisense自动引入node_modules中的JS

  1. 安装VSCode拓展: Npm Intellisense
  2. 配置 Npm Intellisense
{
  "npm-intellisense.scanDevDependencies": true,
  "npm-intellisense.importES6": true,
  "npm-intellisense.importQuotes": "'",
  "npm-intellisense.importLinebreak": ";rn",
  "npm-intellisense.importDeclarationType": "const",
}
  1. VSCode输入命令(Ctrl/Command + Shift + P): Npm Intellisense: Import module后, 选择引入包

其他

自动引入Vue组件和JS模块后,按住Ctrl/Command点击路径可直接跳到该文件
不再手写import – VSCode自动引入Vue组件和Js模块-脚本宝典

文章原始发布于:我的博客

总结

以上是脚本宝典为你收集整理的

不再手写import – VSCode自动引入Vue组件和Js模块

全部内容,希望文章能够帮你解决

不再手写import – VSCode自动引入Vue组件和Js模块

所遇到的程序开发问题,欢迎加入QQ群277859234一起讨论学习。如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典网站推荐给程序员好友。 本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。

80%的人都看过