IT数码 购物 网址 头条 软件 日历 阅读 图书馆
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
图片批量下载器
↓批量下载图片,美女图库↓
图片自动播放器
↓图片自动播放器↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁
 
   -> JavaScript知识库 -> TypeScript(tsconfig.json) -> 正文阅读

[JavaScript知识库]TypeScript(tsconfig.json)

tsconfig.json

使用tsc来编译所有文件
必须先新建一个tsconfig.json文件
内部默认内容可以先删除
运行tsc命令,所有的ts文件都会被编译为js文件
在这里插入图片描述
在这里插入图片描述

-w命令

ts -w命令会监视所有ts文件

监视:js编译文件会自动同步编译,不用再去一个个文件单独编译

在这里插入图片描述

tsconfig.json中的配置

src

./src/**/* **指的是任意目录,*指的是任意文件

在这里插入图片描述

exclude

exclude是有默认值的,如果是要不包括默认值中的那些文件,可以不配置exclude

files

files一般用在比较小的项目上,因为files要把一个个文件都列出来
在这里插入图片描述

files需要把 需要编译的文件都列出来

compilerOptions

compilerOptions 编译器的选项,决定了编译器怎么对ts文件编译,可以说是配置中最重要的配置
在这里插入图片描述

主要就是看compilerOptions中的子选项

target
target 指定编译成的是哪个版本的js

target如果设成ES3,那ts中的let,在编译完成的js文件中会变成var

设置成ESNext 就是当前最新的es版本

设置一个错误的值,报错信息中会有所有能写的es版本写法

在这里插入图片描述

module
module 指定要使用的模块化的规范
所有的选项(蓝色)
在这里插入图片描述
在这里插入图片描述
注:
一般推荐使用es2015(es2015就是es6)

如果把es2015改为commonjs的话,会把import的写法改为require引入的写法

在这里插入图片描述
在这里插入图片描述
注:
上面的引入中应该都写成./m.js第一个图里的是写错了

lib
lib 用来指定项目中使用的 库
一般不使用
使用的情况:代码不在浏览器的环境中运行,是在node的环境中运行的,里面没有dom

值可以逗号分隔,一直往下写

在这里插入图片描述
注:
一般情况下 不用设置lib 它有默认值,默认是浏览器的运行环境

outDir
outDir 用来指定编译后文件所在的目录,也就是你编译后的js文件要放在哪儿

一般放在dist目录
在这里插入图片描述

outFile
outFile 输出的文件,可以将代码合并成一个文件

可以把全局作用域中的代码合并成一个文件,文件中有模块化代码,合并不了,会报错

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

合并带有模块化的代码
如果要合并带有模块化的代码,就必须修改module的配置

改成amd或system的模式
在这里插入图片描述
注:
outFile用的不多,一般这种功能多会交给打包工具去完成

allowJs
allowJs 是否对js文件进行编译
默认false
在这里插入图片描述
checkJs
checkJs 检差js代码是否符合语法规范,默认为false
在这里插入图片描述

一般allowJs和checkJs要么一起使用,要么都不使用

removeComments
removeComments 是否移除注释

noEmit
noEmit不生成编译文件

noEmitError
noEmitError 有错误时不生成编译后的文件,默认值是false
在这里插入图片描述

alwaysScrict
就是把编译变的严格了
alwaysScrict 设置编译后的文件,是否使用严格模式,默认值为false

noImplicitAny
noImplicitAny 不允许隐式any类型

noImplicitThis
noImplicitThis 不允许不明确类型的this
默认值是false
在这里插入图片描述

把noImplicitThis的值改为true
this报错
在这里插入图片描述

解决方法:
给this指定任意一个类型
在这里插入图片描述

strictNullChecks
strictNullChecks 严格的检查空值
比如给一个dom绑定点击事件,但该dom可能会没有或者回去不到,所以这个校验会报错
在这里插入图片描述
在这里插入图片描述
解决方法:
添加一个判断
在这里插入图片描述
另一种dom后面 加?.的写法
在这里插入图片描述
在这里插入图片描述

strict
strict 所有严格检查的总开关
一般会写在所有的严格检查选项的最上方
在这里插入图片描述
它的值是true,所有的严格模式的选项的值都为true,并且这些选项可以都不写
在这里插入图片描述
设为false都是false

注:
一般开发建议设置为true,把所有的严格检查都打开,这样使代码更严谨,代码运行起来出错概率更低

  JavaScript知识库 最新文章
ES6的相关知识点
react 函数式组件 & react其他一些总结
Vue基础超详细
前端JS也可以连点成线(Vue中运用 AntVG6)
Vue事件处理的基本使用
Vue后台项目的记录 (一)
前后端分离vue跨域,devServer配置proxy代理
TypeScript
初识vuex
vue项目安装包指令收集
上一篇文章      下一篇文章      查看所有文章
加:2022-07-21 21:27:19  更:2022-07-21 21:29:29 
 
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁

360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年11日历 -2024/11/23 13:45:32-

图片自动播放器
↓图片自动播放器↓
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
图片批量下载器
↓批量下载图片,美女图库↓
  网站联系: qq:121756557 email:121756557@qq.com  IT数码