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

最新推荐文章于 2024-06-27 17:34:47 发布

转载最新推荐文章于 2024-06-27 17:34:47 发布 · 1.1k 阅读

1 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/terrysu/p/9329570.html

文章标签：

#javascript #开发工具 #ViewUI

部署运行你感兴趣的模型镜像

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

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

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

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

支持Webpack别名路径

同上，需更新 jsconfig.json

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

在JS中自动引入node_modules中的JS

以lodash为例，安装 lodash: npm install lodash
在根目录添加 jsconfig.json

{
  "compilerOptions": {
    "checkJs": true,
  },
  "include": [
    "node_modules/lodash/*"
  ],
}

输入关键字后，点击提示灯泡（快键键: Ctrl/Command + .），选择JS模块

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

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

安装VSCode拓展： Npm Intellisense
配置 Npm Intellisense

{
  "npm-intellisense.scanDevDependencies": true,
  "npm-intellisense.importES6": true,
  "npm-intellisense.importQuotes": "'",
  "npm-intellisense.importLinebreak": ";\r\n",
  "npm-intellisense.importDeclarationType": "const",
}