如何在现有vue 2程序中导入typescript
在现有的Vue 2程序中导入TypeScript可以通过以下步骤完成：
- 安装TypeScript依赖：在项目根目录下打开终端，运行以下命令安装TypeScript依赖：
npm install typescript --save-dev- 创建TypeScript配置文件：在项目根目录下创建一个名为
tsconfig.json的文件，并添加以下内容：
{
"compilerOptions": {
"target": "es5",
"module": "esnext",
"strict": true,
"esModuleInterop": true,
"experimentalDecorators": true,
"allowSyntheticDefaultImports": true,
"moduleResolution": "node",
"resolveJsonModule": true,
"noImplicitAny": false,
"sourceMap": true,
"types": [
"webpack-env",
"jest"
],
"lib": [
"esnext",
"dom",
"dom.iterable",
"scripthost"
],
"baseUrl": ".",
"paths": {
"@/*": [
"src/*"
]
}
},
"include": [
"src/**/*.ts",
"src/**/*.tsx",
"src/**/*.vue",
"tests/**/*.ts",
"tests/**/*.tsx"
],
"exclude": [
"node_modules"
]
}这个配置文件指定了TypeScript编译器的选项，以及需要编译的文件和排除的文件。
- 将Vue文件重命名为
.vue.ts：为了让TypeScript能够正确解析Vue文件，需要将Vue文件的扩展名从.vue改为.vue.ts。 - 安装Vue的TypeScript声明文件：在项目根目录下打开终端，运行以下命令安装Vue的TypeScript声明文件：
npm install vue@next @types/vue@next --save这将安装Vue 3的TypeScript声明文件，因为Vue 3对TypeScript的支持更好，但它也可以与Vue 2一起使用。
- 配置Webpack或其他构建工具：如果你使用Webpack或其他构建工具来构建你的Vue项目，你需要相应地配置它们以支持TypeScript。具体的配置取决于你使用的构建工具，你可以参考它们的文档进行配置。
- 开始使用TypeScript：现在你可以在Vue组件中使用TypeScript了。你可以在
.vue.ts文件中编写TypeScript代码，并使用TypeScript的语法和类型系统来增强你的开发体验。
总结：
在现有的Vue 2程序中导入TypeScript，你需要安装TypeScript依赖、创建TypeScript配置文件、将Vue文件重命名为.vue.ts、安装Vue的TypeScript声明文件，并根据需要配置构建工具。这样你就可以在Vue组件中使用TypeScript来提高开发效率和代码质量。
相关·内容
我想在现有的vue 2程序中导入typescript，基于javascript。我希望以增量的方式进行开发，而不是进行大多数更改。老板们有什么解决方案吗？
浏览 60提问于2021-08-06得票数 0
我有一个vue2应用程序，我想开始对一些服务文件使用TypeScript (而不改变现有的js/vue文件)。为了增加对TypeScript的支持，我使用了vue-cli，它看起来很有效:我添加了一个带有TypeScript函数- myFunction的myService.ts文件，并且在这个文件中vue检测到了正确的类型问题我还可以将此服务导入vue组
浏览 9提问于2022-03-14得票数 2
我正在扩展默认的Vue对象 Object.defineProperties(Vue.prototype, { return axiosInstance }}
我使用的是typescript，当然typescript不喜欢这样。我如何创建一个特定于项目的.d.ts文件，在vue类型脚本声明中添加上述扩展名？
浏览 6提问于2017-03-31得票数 7
我试图在typescript中动态导入一个单独的文件vue组件，但得到了一个错误： /Users/lilei/Desktop/designer-web/node_modules/fork-ts-checker-webpack-plugin/typescript/lib/typescript.js:36457:25)
浏览 26提问于2019-03-13得票数 1
回答已采纳
我正在尝试通过添加vuetype来切换到TypeScript。'} var path = require('path')
var utils请注意，如果我将导入更改为'./App‘(没有.vue，它会显示"(2,17)：error TS2307: Cannot find module '.&
浏览 16提问于2017-08-09得票数 4
1回答
我正在使用Vue.js和TypeScript，并且我做了一个DataPicker。它正在工作，但由于TypeScript中的错误，我无法构建。这是我的DatePicker typescript文件：export default Vue.extend({ message1有没有人知道如何在我的DatePicker.ts<em
浏览 318提问于2021-02-15得票数 1
回答已采纳
我正在尝试在我的vue项目中使用Semantic-UI-Vue。\n类型‘导入类型(“语义-ui-Vue”)’不能分配到键入‘PluginFunction<{}>’。\n类型导入类型(“语义-ui-Vue”)‘不能提供签名'(Vue: VueConstructor，options?：{}}未定义)：void’的匹配。“
declare module 'seman
浏览 0提问于2019-01-25得票数 5
回答已采纳
我正在尝试将我的Vue 3单页组件脚本转换为使用TypeScript。当我创建一个全新的Test.vue组件时，我的Visual代码编辑器没有TypeScript错误：import { defineComponent, inject但是，当我将现有的其他ExternalApi.vue组件转换为相同的东西时，我在defineComponent、inject和ref上看到了错误。我不确定这个文件是做什么的，但是它在克隆的
浏览 19提问于2021-10-15得票数 2
回答已采纳
3回答
我的团队在Vue 2开发了基于类的组件和类型记录的应用程序。我遵循了这个指南(我只能推荐) "@vue/cli-plugin-typescript": "^4.5.15",
"@vue/eslint-config-<
浏览 50提问于2022-02-23得票数 6
2回答
//main.tsVue.component('component-one', require('.<template></template>import Vue from
浏览 25提问于2019-09-19得票数 0
回答已采纳
问题这个项目是由vue-cli使用Typescript，版本3.2.1引导的。我尝试的是使用require直接导入到我的文件中，但这并不起作用。然后，我尝试使用import导入，但无济于事
这是我尝试过的：
./assets/img/h
浏览 4提问于2019-01-10得票数 4
我想为vue使用一个插件，在文档中它说我必须在代码中放入我可以将导入放在其他导入的附近，但我应该将Vue.use放在哪里？/TextBox.vue' ready: function () {
浏览 43提问于2018-07-27得票数 1
回答已采纳
1回答
我正在尝试用Vue3在Typescript中编写插件。然而，我从一开始就被如何正确地键入插件函数所困。 这就是我到目前为止所知道的： import MyComponent from './src/components/my-component.vue'
app.component
浏览 20提问于2021-02-09得票数 0
我有一个带有Typescript的Vue.js 2项目。在main.ts文件中，我声明了两个变量，我希望在项目中全局访问它们： // ...} 当我运行本地服务器(通过npm run serve命令)时，一切运行正常，但当我创建应用程序构建(通过npm run build命令)并进入服务器上的应用程序(或我硬盘上的index.html文件)时，我
浏览 67提问于2021-04-01得票数 1
回答已采纳
1回答
我正在尝试汇总Vue组件库，它是在typescript + vue-property-decorator上编写的。我在一个单独的文件中有几个Vue组件和plugin类，这些组件被导入到这个文件中： import FormularioForm from '@/FormularioForm.vue'
import FormularioInputfrom '@rollup/plugin-typescript&
浏览 37提问于2020-10-11得票数 4
回答已采纳
我正在尝试将TypeScript添加到现有的VueJS + Rails应用程序中。我克隆了这个演示程序()，然后遵循了的说明$ bundle exec rails webpacker:install:typescript
然后，我按照描述的config/webpack/loaders/typescript.js修改了。/User
浏览 1提问于2018-08-01得票数 0
回答已采纳
我已经准备好了一些东西，我可以使用这个npx命令(在PowerShell中运行)构建我的组件： &npx vue-cli-service build ` --name $component.Name $component.FullName 然后，我根据this article将它们导入到我的vue应用程序中 当使用JS编写组件时，它工作得很好，但是当我尝试在TS中
浏览 21提问于2020-07-10得票数 0
回答已采纳
我想向Vue 3应用程序添加一个全局属性，如建议的here 原型方法不适用于TypeScript。/types/vue' { $config: config} 我想用dev或prod作用域加载一些本地配置文件。作用域文件将不会签入到GIT库中。main.ts现在看起来像这样... import Vue from 'vue'
impo
浏览 201提问于2020-10-01得票数 4
回答已采纳
我想将我的vuejs项目升级为基于类组件的类型记录，但是我在vue问题的中看到了：
那么，现有的基于类组件的项目会发生什么呢？这种在vue3.0中使用打字本的方法安全吗？
浏览 0提问于2020-01-08得票数 18
回答已采纳
我有一个使用Vue的小型.js文件，我希望使用TypeScript编译器进行类型检查： new Vue({ });如果我试图用tsc对其进行类型检查，编译器会抱怨它找不到Vue的声明，尽管我已经安装了vue npm包：'.
6 new Vu
浏览 1提问于2019-06-29得票数 2
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
腾讯会议
实时音视频活动推荐
腾讯云开发者
