在 Vue 与 Cesium 联合开发的过程中,我发现很多 Cesium 代码不宜直接写在 .vue 文件中。同时由于 Cesium 库较为复杂,不借助 TypeScript 的静态类型会导致代码难维护困难等问题。而我本身又不太愿意改变 Vue 现有的开发方式,因此决定通过在 Vue 中增加 TS 解析器的方式来解决以上问题。

步骤如下:

  1. 安装 typescript 和 ts-loader
npm install typescript ts-loader --save-dev
  1. 在根目录下新建 tsconfig.json 配置文件,配置文件可根据自己的需求设置,具体参考官网 [tsconfig.json] 配置指南
{
"compilerOptions": {
"target": "es5",
"module": "commonjs",
"noImplicitAny": true,
"removeComments": true,
"preserveConstEnums": true,
"sourceMap": false
},
"include": ["src/**/*"],
"exclude": ["node_modules","**/*.spec.ts"]
}
  1. 在 vue.config.js 中进行设置
configureWebpack: {
resolve: {extensions: [".ts", ".tsx", ".js", ".json"]},
module: {
rules: [
{ test: /\.ts$/, loader: "ts-loader" },
]
}
}

Vue 2.6 中部分引入 TypeScript 的方法的更多相关文章

  1. Missing artifact com.oracle:ojdbc6:jar:11.2.0.3 Maven中不能引入ojdbc解决方法,错误

    今天从服务器检出Maven项目的时候,遇到了一个问题,就是在pom.xml中引入ojdbc的jar包的时候出错了,提示是Missing artifact com.oracle:ojdbc6:jar:1 ...

  2. vue父组件中调用子组件的方法

    Vue项目中如何在父组件中直接调用子组件的方法: 方案一:通过ref直接调用子组件的方法: //父组件中 <template> <div> <Button @click= ...

  3. CSS系列:在HTML中引入CSS的方法

    HTML与CSS是两个作用不同的语言,它们同时对一个网页产生作用,因此必须将CSS与HTML链接在一起使用.在HTML中,引入CSS的方法主要有4种:行内式.内嵌式.导入式和链接式. 1. 行内式 行 ...

  4. Java中遍历Map对象的方法

    方法一: 在for-each循环中使用entries来遍历 这是最常见的遍历方式,在需要获取key和value时使用. Map<Integer, Integer> map = new Ha ...

  5. vue框架中props的typescript用法

    vue框架中props的typescript用法 在vue中使用typescript时,需要引入vue-property-decorator库来兼容格式. javascript写法 Vue.compo ...

  6. vue中import引入模块路径中@符号是什么意思

    在编写vue文件中引入模块 import model from "@/common/model"; 这里路径前面的“@”符号表示什么意思? resolve: { // 自动补全的扩 ...

  7. 在进行vue的学习,项目中需要引入bootstrap、jquery的步骤。

    在进行vue的学习,项目中需要引入bootstrap.jquery的步骤. 一.引入jQuery 在当前项目的目录下(就是package.json),运行命令 cnpm install jquery ...

  8. Vue如何在data中正常引入图片路径

    在Vue项目中通过data设置图片路径,然后在template中引入后页面无法显示图片,浏览器控制台报错:                        刚开始以为是路径出问题了,于是绝对路径.相对路 ...

  9. vue第四单元(初识vue-在页面中直接引入vue框架-学习使用vue语法-vue的指令-介绍data用法-methods用法)

    第四单元(初识vue-在页面中直接引入vue框架-学习使用vue语法-vue的指令-介绍data用法-methods用法) #课程目标 了解 vue 框架的特点 掌握创建 vue 实例 掌握 data ...

随机推荐

  1. centos7 部署安装gitlab服务器

    概念: git 是一种版本控制系统,是一个命令,是一种工具 gitlib 是用于实现git功能的开发库 github 是一个基于git实现的在线代码托管仓库,包含一个网站界面,向互联网开放 gitla ...

  2. leveldb实现原理

    LevelDb日知录之一:LevelDb 101 说起LevelDb也许您不清楚,但是如果作为IT工程师,不知道下面两位大神级别的工程师,那您的领导估计会Hold不住了:Jeff Dean和Sanja ...

  3. ROS time stamp and sync

    1. https://answers.ros.org/question/189867/what-is-the-timestamp/ In ROS messages timestamp is taken ...

  4. Windows下U盘管理程序

    一个操作系统的作业,生成的程序需要使用管理员权限运行,参考了很多网上的代码,如果打开错误,请修改字符集为使用多字节字符集,并且调整为release模式. 作业的内容如下: 任务操作系统API应用体验与 ...

  5. 保护代理模式-Access Proxy(Java实现)

    保护代理模式-Access Proxy 保护代理模式(Access Proxy), 也叫Protect Proxy. 这种代理用于对真实对象的功能做一些访问限制, 在代理层做身份验证. 通过了验证, ...

  6. [Android] Android 使用 FragmentTabHost + Fragment 实现 微信 底部菜单

    Android 使用 FragmentTabHost + Fragment 实现 微信 底部菜单 利用FragmentTabHost实现底部菜单,在该底部菜单中,包括了4个TabSpec,每个TabS ...

  7. VS打开项目 提示Asp.net4.0未在web服务器上注册的解决方案

    Visual Studio2013 下载的Visual Studio2013更新4 http://go.microsoft.com/fwlink/?LinkId=510314有关的Visual Stu ...

  8. python 使用win32com实现对word文档批量替换页眉页脚

    最近由于工作需要,需要将70个word文件的页眉页脚全部进行修改,在想到这个无聊/重复/没有任何技术含量的工作时,我的内心是相当奔溃的.就在我接近奔溃的时候我突然想到完全可以用python脚本来实现这 ...

  9. Mac平台Clion配置GLFW+GLAD的项目

    前期的准备工作详见LearnOpenGL CN 看这篇教程的前提是假设你已经编译好了GLFW文件夹以及下载好了GLAD,不会的话可以看我的另一篇 文章的前部分: 配置 Clion新建一个项目,CMak ...

  10. phpinfo

    phpinfo是一个运行指令,为显示php服务器的配置信息.    phpinfo函数是PHP最为常用的配置输出函数.phpinfo函数能够输出服务器PHP当前状态的大量信息,其中包含了PHP的编译选 ...