资讯专栏INFORMATION COLUMN

介绍vue项目中jsconfig.json概念及使用步骤

3403771864 / 318人阅读

    先为大家介绍在vue项目中 jsconfig.json

  官方说明:当您在工作空间中有一个定义项目上下文的jsconfig.json文件时,JavaScript体验会得到改进。

  概述

  目录中存在tsconfig.json文件表明该目录是 TypeScript 项目的根目录。该tsconfig.json文件指定编译项目所需的根文件和编译器选项。

  JavaScript 项目可以使用jsconfig.json文件来代替,两者近乎相同,同时默认启用了一些与 JavaScript 相关的编译器标志。

  一、使用tsconfig.json或jsconfig.json

  jsconfig.json源于tsconfig.json,是TypeScript的配置文件。
  jsconfig.json相当于tsconfig.json的“allowJs”属性设置为true

  二、使用步骤

  1. 配置说明

  代码如下(示例):

  {
  "compilerOptions": {
  "baseUrl": ".",
  "paths": {
  // 解决项目中使用@作为路径别名,导致vscode无法跳转文件的问题
  "@/*": ["src/*"]
  },
  // 解决prettier对于装饰器语法的警告
  "experimentalDecorators": true,
  // 解决.jsx文件无法快速跳转的问题
  "jsx": "preserve"
  },
  //提高 IDE 性能
  "exclude": ["node_modules", "dist", "build"]
  }

  *Tips就是解释下exclude为什么 提高 编译器 性能 ?

  就是当开发的项目根目录下没有 jsconfig.json,在默认情况下,像 VS Code, 默认只会把 node_modules文件夹排除掉。

  官方建议:

  只要有可能,您应该使用不属于项目源代码的JavaScript文件排除文件夹。

  意思就是与开发无关的文件可以让 IDE 全部在编译时排除掉,像上面的配置中就排除了,构建过程依赖文件(node_modules)和生成的文件(dist 目录) 排除这些文件,可以提高 vscode 的性能。

  2. 配置 webpack 别名

  咋样,新手是不是无从下手那,太乱了。

  现在它来了,你需要配置paths :

  "paths": {
  "@/*": ["src/*"]
  }

  用 @ 代替 项目中 src目录,我们在 src 目录下 找 components 就简单多了

  3. compilerOptions配置

  本文内容已全部讲述完毕,欢迎大家关注后续更多精彩内容。


文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/129038.html

相关文章

  • RxJava系列二(基本念及使用介绍

    ...u.com/p/20687307 RxJava系列1(简介) RxJava系列2(基本念及使用介绍) RxJava系列3(转换操作符) RxJava系列4(过滤操作符) RxJava系列5(组合操作符) RxJava系列6(从微观角度解读RxJava源码) RxJava系列7(最佳实践) 前言 上一篇的示例代码大家一...

    simpleapples 评论0 收藏0
  • RxJava系列二(基本念及使用介绍

    ...u.com/p/20687307 RxJava系列1(简介) RxJava系列2(基本念及使用介绍) RxJava系列3(转换操作符) RxJava系列4(过滤操作符) RxJava系列5(组合操作符) RxJava系列6(从微观角度解读RxJava源码) RxJava系列7(最佳实践) 前言 上一篇的示例代码大家一...

    Profeel 评论0 收藏0
  • 可视化编程的几个基础念及个人理解

    纹理 可将纹理简单理解一张图片。用来修改由光栅化产生的片元颜色的图像。将纹理贴到图元的过程,称为纹理映射。纹素:纹理元素,纹素从纹理内存获得,表示的是将纹理贴到相应片元上的颜色。也就是说,纹素可简...

    lk20150415 评论0 收藏0
  • 不再手写import - VSCode自动引入Vue组件和Js模块

    ...e拓展: Vetur 自动引入Vue组件和普通Js模块 在根目录添加 jsconfig.json 。 每次修改jsconfig.json后需重启该VSCode窗口 { "include": [ "./src/**/*" ], } 支持Webpack别名路径 同上,需更新 jsconfig.json { "compilerOptions": { "baseUrl": ".", "pa...

    LiuRhoRamen 评论0 收藏0
  • ElasticSearch重要念及简单用法

    ...lasticSearch搭建的环境继续学习,从念开始,本篇文章将介绍ElasticSearch的一些重要念及部分原理性念,以下内容简称为ES。 一、ES部分名词解释 1.NRT:英文全称为Near RrealTime。文意思为近实时,从写入数据到可以被搜...

    Corwien 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<