Vue 2.6 中部分引入 TypeScript 的方法
在 Vue 与 Cesium 联合开发的过程中,我发现很多 Cesium 代码不宜直接写在 .vue 文件中。同时由于 Cesium 库较为复杂,不借助 TypeScript 的静态类型会导致代码难维护困难等问题。而我本身又不太愿意改变 Vue 现有的开发方式,因此决定通过在 Vue 中增加 TS 解析器的方式来解决以上问题。
步骤如下:
- 安装 typescript 和 ts-loader
npm install typescript ts-loader --save-dev
- 在根目录下新建 tsconfig.json 配置文件,配置文件可根据自己的需求设置,具体参考官网 [tsconfig.json] 配置指南
{
"compilerOptions": {
"target": "es5",
"module": "commonjs",
"noImplicitAny": true,
"removeComments": true,
"preserveConstEnums": true,
"sourceMap": false
},
"include": ["src/**/*"],
"exclude": ["node_modules","**/*.spec.ts"]
}
- 在 vue.config.js 中进行设置
configureWebpack: {
resolve: {extensions: [".ts", ".tsx", ".js", ".json"]},
module: {
rules: [
{ test: /\.ts$/, loader: "ts-loader" },
]
}
}
Vue 2.6 中部分引入 TypeScript 的方法的更多相关文章
- Missing artifact com.oracle:ojdbc6:jar:11.2.0.3 Maven中不能引入ojdbc解决方法,错误
今天从服务器检出Maven项目的时候,遇到了一个问题,就是在pom.xml中引入ojdbc的jar包的时候出错了,提示是Missing artifact com.oracle:ojdbc6:jar:1 ...
- vue父组件中调用子组件的方法
Vue项目中如何在父组件中直接调用子组件的方法: 方案一:通过ref直接调用子组件的方法: //父组件中 <template> <div> <Button @click= ...
- CSS系列:在HTML中引入CSS的方法
HTML与CSS是两个作用不同的语言,它们同时对一个网页产生作用,因此必须将CSS与HTML链接在一起使用.在HTML中,引入CSS的方法主要有4种:行内式.内嵌式.导入式和链接式. 1. 行内式 行 ...
- Java中遍历Map对象的方法
方法一: 在for-each循环中使用entries来遍历 这是最常见的遍历方式,在需要获取key和value时使用. Map<Integer, Integer> map = new Ha ...
- vue框架中props的typescript用法
vue框架中props的typescript用法 在vue中使用typescript时,需要引入vue-property-decorator库来兼容格式. javascript写法 Vue.compo ...
- vue中import引入模块路径中@符号是什么意思
在编写vue文件中引入模块 import model from "@/common/model"; 这里路径前面的“@”符号表示什么意思? resolve: { // 自动补全的扩 ...
- 在进行vue的学习,项目中需要引入bootstrap、jquery的步骤。
在进行vue的学习,项目中需要引入bootstrap.jquery的步骤. 一.引入jQuery 在当前项目的目录下(就是package.json),运行命令 cnpm install jquery ...
- Vue如何在data中正常引入图片路径
在Vue项目中通过data设置图片路径,然后在template中引入后页面无法显示图片,浏览器控制台报错: 刚开始以为是路径出问题了,于是绝对路径.相对路 ...
- vue第四单元(初识vue-在页面中直接引入vue框架-学习使用vue语法-vue的指令-介绍data用法-methods用法)
第四单元(初识vue-在页面中直接引入vue框架-学习使用vue语法-vue的指令-介绍data用法-methods用法) #课程目标 了解 vue 框架的特点 掌握创建 vue 实例 掌握 data ...
随机推荐
- [BZOJ4318] OSU!
比较简单,每个键分两种情况计算期望. 然而要注意的是,期望是线性运算,期望的平方不是平方的期望 . #include <cmath> #include <queue> #inc ...
- 桥接模式-Bridge(Java实现)
桥接模式-Bridge 桥梁模式的用意是"将抽象化(Abstraction)与实现化(Implementation)脱耦, 将"类的功能层次结构" 与 "类的实 ...
- java连接jdbc
package com.dy.util; import java.sql.Connection; import java.sql.DriverManager; import java.sql.SQLE ...
- java构造方法的重载
package test; public class Person { String name; int age; public Person() { System.out.println(" ...
- Spring Cloud微服务实践之路-起始
由于各种原因,公司要对现有的营销产品进行微服务化,如果可以,则对公司所有产品逐步进行微服务化. 而本人将探索这条路,很艰难,但干劲十足.整个过会记录下来,以便以后查阅. 感谢公司!感谢领导! 相关书籍 ...
- 深入理解line-height与vertical-align——前端布局常用属性
line-height.font-size.vertical-align是设置行内元素布局的关键属性.这三个属性是相互依赖的关系,改变行间距离.设置垂直对齐等都需要它们的通力合作.下面将主要介绍lin ...
- 转化.vdi到.vmdk
OracleVirtualBox转化.vdi到.vmdk E:\Genymotion-deployed\CentOS_7_64>"D:/Program Files/Oracle/Vir ...
- shell 脚本实现定时备份mysql数据库
首先要知道直接在脚本中输入mysql的密码是不被允许的,但是我们可以曲线救国 1. 在新建一个文件专门用来存储用户密码 如: vim ./.mysql.conf [mysqldump] user=yo ...
- element-ui多选框模糊搜索输入文字闪动问题
.el-select__tags { .el-select__input { width: 50px !important; } } 添加这段代码即可 <el-select v-model=&q ...
- 浅入深出Vue:环境搭建
浅入深出Vue:环境搭建 工欲善其事必先利其器,该搭建我们的环境了. 安装NPM 所有工具的下载地址都可以在导航篇中找到,这里我们下载的是最新版本的NodeJS Windows安装程序 下载下来后,直 ...