设置Meteor、Vue和Typescript

html5 • 2022年8月31日 pm1:29 • 问答

我正在努力让 Meteor、Vue 和 Typescript 协同工作。我找不到关于 Meteor、Vue 和 Typescript 的任何教程，示例 github 项目也无法正常工作，并且使用变通方法来避免我遇到的问题。例如，将 Typescript 代码分离到它自己的文件中，而不是将它放在脚本标签中。

根据本教程，我应该能够以两种不同的方式定义我的组件。

<script lang="ts">
import { Component, Vue } from 'vue-property-decorator'

@Component
export default class HelloWorld extends Vue {
}
</script>

<script lang="ts">
@component({
    name: 'HelloWorld'
})
</script>

如果我创建了一个meteor vue项目并执行这些步骤，上面的代码有错误。

流星创造

meteor create --vue "vue-typescript-test"

添加 tsconfig.json

{
  "compilerOptions": {
    "lib": ["dom", "es5", "es2015"],
    "target": "es5",
    "module": "es2015",
    "moduleResolution": "node",
    "sourceMap": true,
    "allowSyntheticDefaultImports": true
  }
}

添加 ts-loader

npm i -D typescript ts-loader

添加 vue-property-decorator

npm install vue-property-decorator

如果我Hello.vue像教程提到的那样将脚本更改为使用 Typescript，则会出现错误。

<script lang="ts">
import {Component} from "vue-property-decorator";

@Component({
  name: 'Hello'
})
</script>

错误

[vue-component] Error while compiling in tag <script> using lang ts: Can't find handler for lang 'ts', did you install it?
    [vue-component] Error while compiling in tag <script> using lang ts TemplatingTools is not defined
ReferenceError: TemplatingTools is not defined
at throwCompileError (packages/vue-component/plugin/utils.js:200:15)
at VueComponentTagHandler.getResults (packages/vue-component/plugin/tag-handler.js:81:13)
at compileTags (packages/vue-component/plugin/vue-compiler.js:532:18)
at compileOneFileWithContents (packages/vue-component/plugin/vue-compiler.js:541:12)
at VueCompo.compileOneFile (packages/vue-component/plugin/vue-compiler.js:140:12)
at packages/vue-component/plugin/vue-compiler.js:57:34
at C:UsersMichaelAppDataLocal.meteorpackagesakryum_vue-component.15.2plugin.vue-component.osnpmnode_modulesmeteorvue-componentnode_modulesasyncdistasync.js:3110:16
at replenish (C:UsersMichaelAppDataLocal.meteorpackagesakryum_vue-component.15.2plugin.vue-component.osnpmnode_modulesmeteorvue-componentnode_modulesasyncdistasync.js:1011:17)
at C:UsersMichaelAppDataLocal.meteorpackagesakryum_vue-component.15.2plugin.vue-component.osnpmnode_modulesmeteorvue-componentnode_modulesasyncdistasync.js:1016:9
at Object.eachLimit$1 (C:UsersMichaelAppDataLocal.meteorpackagesakryum_vue-component.15.2plugin.vue-component.osnpmnode_modulesmeteorvue-componentnode_modulesasyncdistasync.js:3196:24)
at VueCompo.processFilesForTarget (packages/vue-component/plugin/vue-compiler.js:41:11)
at __bottom_mark__ (C:UsersMichaelAppDataLocal.meteorpackagesmeteor-tool2.1.0mt-os.windows.x86_64toolsutilstoolsutilsparse-stack.ts:92:14)
at C:toolsisobuildcompiler-plugin.js:212:27
at Object.enterJob (C:toolsutilsbuildmessage.js:388:12)
at C:toolsisobuildcompiler-plugin.js:199:22
at Function.time (C:UsersMichaelAppDataLocal.meteorpackagesmeteor-tool2.1.0mt-os.windows.x86_64toolstool-envtoolstool-envprofile.ts:284:12)
at C:toolsisobuildcompiler-plugin.js:198:15
at Function._.each._.forEach (C:UsersMichaelAppDataLocal.meteorpackagesmeteor-tool2.1.0mt-os.windows.x86_64dev_bundlelibnode_modulesunderscoreunderscore.js:191:9)
at CompilerPluginProcessor.runCompilerPlugins (C:toolsisobuildcompiler-plugin.js:188:7)
at ClientTarget._runCompilerPlugins (C:toolsisobuildbundler.js:1149:22)
at C:toolsisobuildbundler.js:858:34
at Object.enterJob (C:toolsutilsbuildmessage.js:388:12)
at ClientTarget.make (C:toolsisobuildbundler.js:852:18)
at C:toolsisobuildbundler.js:3233:14
at C:toolsisobuildbundler.js:3386:25
at Array.forEach (<anonymous>)
  at C:toolsisobuildbundler.js:3340:14
  at Object.capture (C:toolsutilsbuildmessage.js:283:5)
  at bundle (C:toolsisobuildbundler.js:3214:31)
  at C:toolsisobuildbundler.js:3157:32
  at Slot.withValue (C:UsersMichaelAppDataLocal.meteorpackagesmeteor-tool2.1.0mt-os.windows.x86_64dev_bundlelibnode_modules@wrycontextlibcontext.js:73:29)
  at Object.withCache (C:UsersMichaelAppDataLocal.meteorpackagesmeteor-tool2.1.0mt-os.windows.x86_64toolsfstoolsfsfiles.ts:1663:39)
  at Object.bundle (C:toolsisobuildbundler.js:3157:16)
  at C:toolsrunnersrun-app.js:581:24
  at Function.run (C:UsersMichaelAppDataLocal.meteorpackagesmeteor-tool2.1.0mt-os.windows.x86_64toolstool-envtoolstool-envprofile.ts:289:14)
  at bundleApp (C:toolsrunnersrun-app.js:580:34)
  at AppRunner._runOnce (C:toolsrunnersrun-app.js:627:35)
  at AppRunner._fiber (C:toolsrunnersrun-app.js:948:28)
  at C:toolsrunnersrun-app.js:410:12
  [vue-component] Error while compiling in tag <script> using lang ts: Can't find handler for lang 'ts', did you install it?
    [vue-component] Error while compiling in tag <script> using lang ts TemplatingTools is not defined
      ReferenceError: TemplatingTools is not defined
      at throwCompileError (packages/vue-component/plugin/utils.js:200:15)
      at VueComponentTagHandler.getResults (packages/vue-component/plugin/tag-handler.js:81:13)
      at compileTags (packages/vue-component/plugin/vue-compiler.js:532:18)
      at compileOneFileWithContents (packages/vue-component/plugin/vue-compiler.js:541:12)
      at VueCompo.compileOneFile (packages/vue-component/plugin/vue-compiler.js:140:12)
      at packages/vue-component/plugin/vue-compiler.js:57:34
      at C:UsersMichaelAppDataLocal.meteorpackagesakryum_vue-component.15.2plugin.vue-component.osnpmnode_modulesmeteorvue-componentnode_modulesasyncdistasync.js:3110:16
      at replenish (C:UsersMichaelAppDataLocal.meteorpackagesakryum_vue-component.15.2plugin.vue-component.osnpmnode_modulesmeteorvue-componentnode_modulesasyncdistasync.js:1011:17)
      at C:UsersMichaelAppDataLocal.meteorpackagesakryum_vue-component.15.2plugin.vue-component.osnpmnode_modulesmeteorvue-componentnode_modulesasyncdistasync.js:1016:9
      at Object.eachLimit$1 (C:UsersMichaelAppDataLocal.meteorpackagesakryum_vue-component.15.2plugin.vue-component.osnpmnode_modulesmeteorvue-componentnode_modulesasyncdistasync.js:3196:24)
      at VueCompo.processFilesForTarget (packages/vue-component/plugin/vue-compiler.js:41:11)
      at __bottom_mark__ (C:UsersMichaelAppDataLocal.meteorpackagesmeteor-tool2.1.0mt-os.windows.x86_64toolsutilstoolsutilsparse-stack.ts:92:14)
      at C:toolsisobuildcompiler-plugin.js:212:27
      at Object.enterJob (C:toolsutilsbuildmessage.js:388:12)
      at C:toolsisobuildcompiler-plugin.js:199:22
      at Function.time (C:UsersMichaelAppDataLocal.meteorpackagesmeteor-tool2.1.0mt-os.windows.x86_64toolstool-envtoolstool-envprofile.ts:284:12)
      at C:toolsisobuildcompiler-plugin.js:198:15
      at Function._.each._.forEach (C:UsersMichaelAppDataLocal.meteorpackagesmeteor-tool2.1.0mt-os.windows.x86_64dev_bundlelibnode_modulesunderscoreunderscore.js:191:9)
      at CompilerPluginProcessor.runCompilerPlugins (C:toolsisobuildcompiler-plugin.js:188:7)
      at ClientTarget._runCompilerPlugins (C:toolsisobuildbundler.js:1149:22)
      at C:toolsisobuildbundler.js:858:34
      at Object.enterJob (C:toolsutilsbuildmessage.js:388:12)
      at ClientTarget.make (C:toolsisobuildbundler.js:852:18)
      at C:toolsisobuildbundler.js:3233:14
      at C:toolsisobuildbundler.js:3386:25
      at Array.forEach (<anonymous>)
        at C:toolsisobuildbundler.js:3340:14
        at Object.capture (C:toolsutilsbuildmessage.js:283:5)
        at bundle (C:toolsisobuildbundler.js:3214:31)
        at C:toolsisobuildbundler.js:3157:32
        at Slot.withValue (C:UsersMichaelAppDataLocal.meteorpackagesmeteor-tool2.1.0mt-os.windows.x86_64dev_bundlelibnode_modules@wrycontextlibcontext.js:73:29)
        at Object.withCache (C:UsersMichaelAppDataLocal.meteorpackagesmeteor-tool2.1.0mt-os.windows.x86_64toolsfstoolsfsfiles.ts:1663:39)
        at Object.bundle (C:toolsisobuildbundler.js:3157:16)
        at C:toolsrunnersrun-app.js:581:24
        at Function.run (C:UsersMichaelAppDataLocal.meteorpackagesmeteor-tool2.1.0mt-os.windows.x86_64toolstool-envtoolstool-envprofile.ts:289:14)
        at bundleApp (C:toolsrunnersrun-app.js:580:34)
        at AppRunner._runOnce (C:toolsrunnersrun-app.js:627:35)
        at AppRunner._fiber (C:toolsrunnersrun-app.js:948:28)
        at C:toolsrunnersrun-app.js:410:12
        [vue-component] Error while compiling in tag <script> using lang ts: Can't find handler for lang 'ts', did you install it?
          [vue-component] Error while compiling in tag <script> using lang ts TemplatingTools is not defined
            ReferenceError: TemplatingTools is not defined
            at throwCompileError (packages/vue-component/plugin/utils.js:200:15)
            at VueComponentTagHandler.getResults (packages/vue-component/plugin/tag-handler.js:81:13)
            at compileTags (packages/vue-component/plugin/vue-compiler.js:532:18)
            at compileOneFileWithContents (packages/vue-component/plugin/vue-compiler.js:541:12)
            at VueCompo.compileOneFile (packages/vue-component/plugin/vue-compiler.js:140:12)
            at packages/vue-component/plugin/vue-compiler.js:57:34
            at C:UsersMichaelAppDataLocal.meteorpackagesakryum_vue-component.15.2plugin.vue-component.osnpmnode_modulesmeteorvue-componentnode_modulesasyncdistasync.js:3110:16
            at replenish (C:UsersMichaelAppDataLocal.meteorpackagesakryum_vue-component.15.2plugin.vue-component.osnpmnode_modulesmeteorvue-componentnode_modulesasyncdistasync.js:1011:17)
            at C:UsersMichaelAppDataLocal.meteorpackagesakryum_vue-component.15.2plugin.vue-component.osnpmnode_modulesmeteorvue-componentnode_modulesasyncdistasync.js:1016:9
            at Object.eachLimit$1 (C:UsersMichaelAppDataLocal.meteorpackagesakryum_vue-component.15.2plugin.vue-component.osnpmnode_modulesmeteorvue-componentnode_modulesasyncdistasync.js:3196:24)
            at VueCompo.processFilesForTarget (packages/vue-component/plugin/vue-compiler.js:41:11)
            at __bottom_mark__ (C:UsersMichaelAppDataLocal.meteorpackagesmeteor-tool2.1.0mt-os.windows.x86_64toolsutilstoolsutilsparse-stack.ts:92:14)
            at C:toolsisobuildcompiler-plugin.js:212:27
            at Object.enterJob (C:toolsutilsbuildmessage.js:388:12)
            at C:toolsisobuildcompiler-plugin.js:199:22
            at Function.time (C:UsersMichaelAppDataLocal.meteorpackagesmeteor-tool2.1.0mt-os.windows.x86_64toolstool-envtoolstool-envprofile.ts:284:12)
            at C:toolsisobuildcompiler-plugin.js:198:15
            at Function._.each._.forEach (C:UsersMichaelAppDataLocal.meteorpackagesmeteor-tool2.1.0mt-os.windows.x86_64dev_bundlelibnode_modulesunderscoreunderscore.js:191:9)
            at CompilerPluginProcessor.runCompilerPlugins (C:toolsisobuildcompiler-plugin.js:188:7)
            at ServerTarget._runCompilerPlugins (C:toolsisobuildbundler.js:1149:22)
            at C:toolsisobuildbundler.js:858:34
            at Object.enterJob (C:toolsutilsbuildmessage.js:388:12)
            at ServerTarget.make (C:toolsisobuildbundler.js:852:18)
            at C:toolsisobuildbundler.js:3258:14
            at C:toolsisobuildbundler.js:3392:24
            at Object.capture (C:toolsutilsbuildmessage.js:283:5)
            at bundle (C:toolsisobuildbundler.js:3214:31)
            at C:toolsisobuildbundler.js:3157:32
            at Slot.withValue (C:UsersMichaelAppDataLocal.meteorpackagesmeteor-tool2.1.0mt-os.windows.x86_64dev_bundlelibnode_modules@wrycontextlibcontext.js:73:29)
            at Object.withCache (C:UsersMichaelAppDataLocal.meteorpackagesmeteor-tool2.1.0mt-os.windows.x86_64toolsfstoolsfsfiles.ts:1663:39)
            at Object.bundle (C:toolsisobuildbundler.js:3157:16)
            at C:toolsrunnersrun-app.js:581:24
            at Function.run (C:UsersMichaelAppDataLocal.meteorpackagesmeteor-tool2.1.0mt-os.windows.x86_64toolstool-envtoolstool-envprofile.ts:289:14)
            at bundleApp (C:toolsrunnersrun-app.js:580:34)
            at AppRunner._runOnce (C:toolsrunnersrun-app.js:627:35)
            at AppRunner._fiber (C:toolsrunnersrun-app.js:948:28)
            at C:toolsrunnersrun-app.js:410:12
            => Errors prevented startup:

            While processing files with akryum:vue-component (for target web.browser):
            packages/vue-component/plugin/utils.js:200:15: TemplatingTools is not defined
            at throwCompileError (packages/vue-component/plugin/utils.js:200:15)
            at VueComponentTagHandler.getResults (packages/vue-component/plugin/tag-handler.js:104:11)
            at compileTags (packages/vue-component/plugin/vue-compiler.js:532:18)
            at compileOneFileWithContents (packages/vue-component/plugin/vue-compiler.js:541:12)
            at VueCompo.compileOneFile (packages/vue-component/plugin/vue-compiler.js:140:12)
            at packages/vue-component/plugin/vue-compiler.js:57:34
            at C:UsersMichaelAppDataLocal.meteorpackagesakryum_vue-component.15.2plugin.vue-component.osnpmnode_modulesmeteorvue-componentnode_modulesasyncdistasync.js:3110:16
            at replenish (C:UsersMichaelAppDataLocal.meteorpackagesakryum_vue-component.15.2plugin.vue-component.osnpmnode_modulesmeteorvue-componentnode_modulesasyncdistasync.js:1011:17)
            at C:UsersMichaelAppDataLocal.meteorpackagesakryum_vue-component.15.2plugin.vue-component.osnpmnode_modulesmeteorvue-componentnode_modulesasyncdistasync.js:1016:9
            at Object.eachLimit$1 (C:UsersMichaelAppDataLocal.meteorpackagesakryum_vue-component.15.2plugin.vue-component.osnpmnode_modulesmeteorvue-componentnode_modulesasyncdistasync.js:3196:24)
            at VueCompo.processFilesForTarget (packages/vue-component/plugin/vue-compiler.js:41:11)


            While processing files with akryum:vue-component (for target web.browser.legacy):
            packages/vue-component/plugin/utils.js:200:15: TemplatingTools is not defined
            at throwCompileError (packages/vue-component/plugin/utils.js:200:15)
            at VueComponentTagHandler.getResults (packages/vue-component/plugin/tag-handler.js:104:11)
            at compileTags (packages/vue-component/plugin/vue-compiler.js:532:18)
            at compileOneFileWithContents (packages/vue-component/plugin/vue-compiler.js:541:12)
            at VueCompo.compileOneFile (packages/vue-component/plugin/vue-compiler.js:140:12)
            at packages/vue-component/plugin/vue-compiler.js:57:34
            at C:UsersMichaelAppDataLocal.meteorpackagesakryum_vue-component.15.2plugin.vue-component.osnpmnode_modulesmeteorvue-componentnode_modulesasyncdistasync.js:3110:16
            at replenish (C:UsersMichaelAppDataLocal.meteorpackagesakryum_vue-component.15.2plugin.vue-component.osnpmnode_modulesmeteorvue-componentnode_modulesasyncdistasync.js:1011:17)
            at C:UsersMichaelAppDataLocal.meteorpackagesakryum_vue-component.15.2plugin.vue-component.osnpmnode_modulesmeteorvue-componentnode_modulesasyncdistasync.js:1016:9
            at Object.eachLimit$1 (C:UsersMichaelAppDataLocal.meteorpackagesakryum_vue-component.15.2plugin.vue-component.osnpmnode_modulesmeteorvue-componentnode_modulesasyncdistasync.js:3196:24)
            at VueCompo.processFilesForTarget (packages/vue-component/plugin/vue-compiler.js:41:11)


            While processing files with akryum:vue-component (for target os.windows.x86_64):
            packages/vue-component/plugin/utils.js:200:15: TemplatingTools is not defined
            at throwCompileError (packages/vue-component/plugin/utils.js:200:15)
            at VueComponentTagHandler.getResults (packages/vue-component/plugin/tag-handler.js:104:11)
            at compileTags (packages/vue-component/plugin/vue-compiler.js:532:18)
            at compileOneFileWithContents (packages/vue-component/plugin/vue-compiler.js:541:12)
            at VueCompo.compileOneFile (packages/vue-component/plugin/vue-compiler.js:140:12)
            at packages/vue-component/plugin/vue-compiler.js:57:34
            at C:UsersMichaelAppDataLocal.meteorpackagesakryum_vue-component.15.2plugin.vue-component.osnpmnode_modulesmeteorvue-componentnode_modulesasyncdistasync.js:3110:16
            at replenish (C:UsersMichaelAppDataLocal.meteorpackagesakryum_vue-component.15.2plugin.vue-component.osnpmnode_modulesmeteorvue-componentnode_modulesasyncdistasync.js:1011:17)
            at C:UsersMichaelAppDataLocal.meteorpackagesakryum_vue-component.15.2plugin.vue-component.osnpmnode_modulesmeteorvue-componentnode_modulesasyncdistasync.js:1016:9
            at Object.eachLimit$1 (C:UsersMichaelAppDataLocal.meteorpackagesakryum_vue-component.15.2plugin.vue-component.osnpmnode_modulesmeteorvue-componentnode_modulesasyncdistasync.js:3196:24)
            at VueCompo.processFilesForTarget (packages/vue-component/plugin/vue-compiler.js:41:11)

Meteor、Vue 和 Typescript 项目应该如何正确设置？

更新

如果有人可以展示如何创建可以解决我的问题的 Meteor、Vue、Typescript 和 Vue 类组件语法项目的步骤。

以上是设置Meteor、Vue和Typescript的全部内容。

THE END

二维码

SwiftUI：如何在TextEditor中禁用“智能引号”

< <上一篇

npm错误！无法读取未定义的属性“无关”

下一篇>>

搜索内容

设置Meteor、Vue和Typescript

目录

目录

推荐文章

最新文章