TypeError for typescript Error while compiling in tag <script> using lang ts Cannot read property 'data' of null

SvenWangChina commented 4 years ago

TypeError for typescript

I use v2 for typescript worked fine. But I use v3 got following error:

[vue-component] Error while compiling in tag <script> using lang ts Cannot read property 'data' of null
TypeError: Cannot read property 'data' of null
at typescriptHandler (packages/vue-component-typescript-babel/vue-typescript.js:22:22)
at packages/meteor.js:306:21
at VueComponentTagHandler.getResults (packages/vue-component/plugin/tag-handler.js:91:26)
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 /Users/sven/.meteor/packages/akryum_vue-component/.0.15.2.7g3qva.ld59w++os+web.browser+web.browser.legacy+web.cordova/plugin.vue-component.os/npm/node_modules/meteor/vue-component/node_modules/async/dist/async.js:3110:16
at replenish (/Users/sven/.meteor/packages/akryum_vue-component/.0.15.2.7g3qva.ld59w++os+web.browser+web.browser.legacy+web.cordova/plugin.vue-component.os/npm/node_modules/meteor/vue-component/node_modules/async/dist/async.js:1011:17)
at /Users/sven/.meteor/packages/akryum_vue-component/.0.15.2.7g3qva.ld59w++os+web.browser+web.browser.legacy+web.cordova/plugin.vue-component.os/npm/node_modules/meteor/vue-component/node_modules/async/dist/async.js:1016:9
at Object.eachLimit$1 (/Users/sven/.meteor/packages/akryum_vue-component/.0.15.2.7g3qva.ld59w++os+web.browser+web.browser.legacy+web.cordova/plugin.vue-component.os/npm/node_modules/meteor/vue-component/node_modules/async/dist/async.js:3196:24)
at VueCompo.processFilesForTarget (packages/vue-component/plugin/vue-compiler.js:41:11)
at __bottom_mark__ (/tools/utils/parse-stack.js:69:14)
at /tools/isobuild/compiler-plugin.js:210:27
at Object.enterJob (/tools/utils/buildmessage.js:388:12)
at /tools/isobuild/compiler-plugin.js:197:22
at Function.time (/Users/sven/.meteor/packages/meteor-tool/.1.9.0.1fqaz63.iwu++os.osx.x86_64+web.browser+web.browser.legacy+web.cordova/mt-os.osx.x86_64/tools/tool-env/tools/tool-env/profile.ts:284:12)
at /tools/isobuild/compiler-plugin.js:196:15
at Function._.each._.forEach (/Users/sven/.meteor/packages/meteor-tool/.1.9.0.1fqaz63.iwu++os.osx.x86_64+web.browser+web.browser.legacy+web.cordova/mt-os.osx.x86_64/dev_bundle/lib/node_modules/underscore/underscore.js:191:9)
at CompilerPluginProcessor.runCompilerPlugins (/tools/isobuild/compiler-plugin.js:186:7)
at ClientTarget._runCompilerPlugins (/tools/isobuild/bundler.js:1125:22)
at /tools/isobuild/bundler.js:850:34
at Object.enterJob (/tools/utils/buildmessage.js:388:12)
at ClientTarget.make (/tools/isobuild/bundler.js:844:18)
at /tools/isobuild/bundler.js:3183:14
at /tools/isobuild/bundler.js:3334:25
at Array.forEach (<anonymous>)
at /tools/isobuild/bundler.js:3288:14
at Object.capture (/tools/utils/buildmessage.js:283:5)
at bundle (/tools/isobuild/bundler.js:3164:31)
at /tools/isobuild/bundler.js:3109:32
at Slot.withValue (/Users/sven/.meteor/packages/meteor-tool/.1.9.0.1fqaz63.iwu++os.osx.x86_64+web.browser+web.browser.legacy+web.cordova/mt-os.osx.x86_64/dev_bundle/lib/node_modules/@wry/context/lib/context.js:73:29)
at Object.withCache (/Users/sven/.meteor/packages/meteor-tool/.1.9.0.1fqaz63.iwu++os.osx.x86_64+web.browser+web.browser.legacy+web.cordova/mt-os.osx.x86_64/tools/fs/tools/fs/files.ts:1650:39)
at Object.bundle (/tools/isobuild/bundler.js:3109:16)
at /tools/runners/run-app.js:572:24
at Function.run (/Users/sven/.meteor/packages/meteor-tool/.1.9.0.1fqaz63.iwu++os.osx.x86_64+web.browser+web.browser.legacy+web.cordova/mt-os.osx.x86_64/tools/tool-env/tools/tool-env/profile.ts:289:14)
at bundleApp (/tools/runners/run-app.js:571:34)
at AppRunner._runOnce (/tools/runners/run-app.js:613:35)
at AppRunner._fiber (/tools/runners/run-app.js:919:28)
at /tools/runners/run-app.js:401:12

OS & Version: macOS
Vue version: v2.6.11
Component Version: v3.1.1

NightCatSama commented 4 years ago

How do you use components?

SvenWangChina commented 4 years ago

I created the project with Meteor.js(v1.9)+Vue.js(v2.6.11)+TypeScript, I got the err when I run the project, don't need import the component.

MichaelHaywood commented 3 years ago

@SvenWangChina Did you find a solution to this? I'm getting this same error but when using Vue 2.

If I create a new project and run these commands and add these files, I get the same error.

CMD

meteor create --vue vue-typescript
meteor add typescript
meteor npm install --save-dev @types/meteor
meteor add nathantreid:vue-typescript-babel
meteor npm install --save-dev @babel/plugin-transform-typescript
npm install --save vue vue-class-component
npm install --save-dev @babel/plugin-proposal-decorators @babel/plugin-proposal-class-properties

tsconfig.json

{
  "compilerOptions": {
    "target": "es5",
    "module": "es2015",
    "moduleResolution": "node",
    "strict": true,
    "experimentalDecorators": true
  }
}

.babelrc

{
  "plugins": [
    ["@babel/proposal-decorators", { "legacy": true }],
    ["@babel/proposal-class-properties", { "loose": true }]
  ]
}

package.json

{
  "name": "vue-typescript",
  "private": true,
  "scripts": {
    "start": "meteor run",
    "test": "meteor test --once --driver-package meteortesting:mocha",
    "test-app": "TEST_WATCH=1 meteor test --full-app --driver-package meteortesting:mocha",
    "visualize": "meteor --production --extra-packages bundle-visualizer"
  },
  "dependencies": {
    "@babel/runtime": "^7.11.2",
    "meteor-node-stubs": "^1.0.1",
    "vue": "^2.6.12",
    "vue-class-component": "^7.2.6",
    "vue-meteor-tracker": "^2.0.0-beta.5",
    "vue-property-decorator": "^9.1.2"
  },
  "meteor": {
    "mainModule": {
      "client": "client/main.js",
      "server": "server/main.js"
    },
    "testModule": "tests/main.js"
  },
  "devDependencies": {
    "@babel/core": "^7.4.4",
    "@babel/plugin-proposal-class-properties": "^7.13.0",
    "@babel/plugin-proposal-decorators": "^7.13.5",
    "@babel/plugin-syntax-decorators": "^7.2.0",
    "@babel/plugin-syntax-dynamic-import": "^7.2.0",
    "@babel/plugin-syntax-jsx": "^7.2.0",
    "@babel/plugin-transform-typescript": "^7.13.0",
    "@babel/preset-typescript": "^7.3.3",
    "@types/meteor": "^1.4.67"
  }
}

Hello.vue

<template>
  <div>
    <button>Click Me</button>
    <p>You've pressed the button times.</p>
  </div>
</template>

<script lang="ts">
import Component from "vue-class-component";
import Vue from "vue";

@Component
export default class Hello extends Vue {

}
</script>

<style scoped>
  p {
    font-family: serif;
  }
</style>

Error

[vue-component] Error while compiling in tag <script> using lang ts Cannot read property 'data' of null
TypeError: Cannot read property 'data' of null
    at typescriptHandler (packages/vue-component-typescript-babel/vue-typescript.js:22:22)
    at packages/meteor.js:306:21
    at VueComponentTagHandler.getResults (packages/vue-component/plugin/tag-handler.js:91:26)
    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:\Users\Michael\AppData\Local\.meteor\packages\akryum_vue-component\0.15.2\plugin.vue-component.os\npm\node_modules\meteor\vue-component\node_modules\async\dist\async.js:3110:16
    at replenish (C:\Users\Michael\AppData\Local\.meteor\packages\akryum_vue-component\0.15.2\plugin.vue-component.os\npm\node_modules\meteor\vue-component\node_modules\async\dist\async.js:1011:17)
    at C:\Users\Michael\AppData\Local\.meteor\packages\akryum_vue-component\0.15.2\plugin.vue-component.os\npm\node_modules\meteor\vue-component\node_modules\async\dist\async.js:1016:9
    at Object.eachLimit$1 (C:\Users\Michael\AppData\Local\.meteor\packages\akryum_vue-component\0.15.2\plugin.vue-component.os\npm\node_modules\meteor\vue-component\node_modules\async\dist\async.js:3196:24)
    at VueCompo.processFilesForTarget (packages/vue-component/plugin/vue-compiler.js:41:11)
    at __bottom_mark__ (C:\Users\Michael\AppData\Local\.meteor\packages\meteor-tool\2.1.0\mt-os.windows.x86_64\tools\utils\tools\utils\parse-stack.ts:92:14)
    at C:\tools\isobuild\compiler-plugin.js:212:27
    at Object.enterJob (C:\tools\utils\buildmessage.js:388:12)
    at C:\tools\isobuild\compiler-plugin.js:199:22
    at Function.time (C:\Users\Michael\AppData\Local\.meteor\packages\meteor-tool\2.1.0\mt-os.windows.x86_64\tools\tool-env\tools\tool-env\profile.ts:284:12)
    at C:\tools\isobuild\compiler-plugin.js:198:15
    at Function._.each._.forEach (C:\Users\Michael\AppData\Local\.meteor\packages\meteor-tool\2.1.0\mt-os.windows.x86_64\dev_bundle\lib\node_modules\underscore\underscore.js:191:9)
    at CompilerPluginProcessor.runCompilerPlugins (C:\tools\isobuild\compiler-plugin.js:188:7)
    at ClientTarget._runCompilerPlugins (C:\tools\isobuild\bundler.js:1149:22)
    at C:\tools\isobuild\bundler.js:858:34
    at Object.enterJob (C:\tools\utils\buildmessage.js:388:12)
    at ClientTarget.make (C:\tools\isobuild\bundler.js:852:18)
    at C:\tools\isobuild\bundler.js:3233:14
    at C:\tools\isobuild\bundler.js:3386:25
    at Array.forEach (<anonymous>)
    at C:\tools\isobuild\bundler.js:3340:14
    at Object.capture (C:\tools\utils\buildmessage.js:283:5)
    at bundle (C:\tools\isobuild\bundler.js:3214:31)
    at C:\tools\isobuild\bundler.js:3157:32
    at Slot.withValue (C:\Users\Michael\AppData\Local\.meteor\packages\meteor-tool\2.1.0\mt-os.windows.x86_64\dev_bundle\lib\node_modules\@wry\context\lib\context.js:73:29)
    at Object.withCache (C:\Users\Michael\AppData\Local\.meteor\packages\meteor-tool\2.1.0\mt-os.windows.x86_64\tools\fs\tools\fs\files.ts:1663:39)
    at Object.bundle (C:\tools\isobuild\bundler.js:3157:16)
    at C:\tools\runners\run-app.js:581:24
    at Function.run (C:\Users\Michael\AppData\Local\.meteor\packages\meteor-tool\2.1.0\mt-os.windows.x86_64\tools\tool-env\tools\tool-env\profile.ts:289:14)
    at bundleApp (C:\tools\runners\run-app.js:580:34)
    at AppRunner._runOnce (C:\tools\runners\run-app.js:627:35)
    at AppRunner._fiber (C:\tools\runners\run-app.js:948:28)
    at C:\tools\runners\run-app.js:410:12
[vue-component] Error while compiling in tag <script> using lang ts Cannot read property 'data' of null
TypeError: Cannot read property 'data' of null
    at typescriptHandler (packages/vue-component-typescript-babel/vue-typescript.js:22:22)
    at packages/meteor.js:306:21
    at VueComponentTagHandler.getResults (packages/vue-component/plugin/tag-handler.js:91:26)
    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:\Users\Michael\AppData\Local\.meteor\packages\akryum_vue-component\0.15.2\plugin.vue-component.os\npm\node_modules\meteor\vue-component\node_modules\async\dist\async.js:3110:16
    at replenish (C:\Users\Michael\AppData\Local\.meteor\packages\akryum_vue-component\0.15.2\plugin.vue-component.os\npm\node_modules\meteor\vue-component\node_modules\async\dist\async.js:1011:17)
    at C:\Users\Michael\AppData\Local\.meteor\packages\akryum_vue-component\0.15.2\plugin.vue-component.os\npm\node_modules\meteor\vue-component\node_modules\async\dist\async.js:1016:9
    at Object.eachLimit$1 (C:\Users\Michael\AppData\Local\.meteor\packages\akryum_vue-component\0.15.2\plugin.vue-component.os\npm\node_modules\meteor\vue-component\node_modules\async\dist\async.js:3196:24)
    at VueCompo.processFilesForTarget (packages/vue-component/plugin/vue-compiler.js:41:11)
    at __bottom_mark__ (C:\Users\Michael\AppData\Local\.meteor\packages\meteor-tool\2.1.0\mt-os.windows.x86_64\tools\utils\tools\utils\parse-stack.ts:92:14)
    at C:\tools\isobuild\compiler-plugin.js:212:27
    at Object.enterJob (C:\tools\utils\buildmessage.js:388:12)
    at C:\tools\isobuild\compiler-plugin.js:199:22
    at Function.time (C:\Users\Michael\AppData\Local\.meteor\packages\meteor-tool\2.1.0\mt-os.windows.x86_64\tools\tool-env\tools\tool-env\profile.ts:284:12)
    at C:\tools\isobuild\compiler-plugin.js:198:15
    at Function._.each._.forEach (C:\Users\Michael\AppData\Local\.meteor\packages\meteor-tool\2.1.0\mt-os.windows.x86_64\dev_bundle\lib\node_modules\underscore\underscore.js:191:9)
    at CompilerPluginProcessor.runCompilerPlugins (C:\tools\isobuild\compiler-plugin.js:188:7)
    at ServerTarget._runCompilerPlugins (C:\tools\isobuild\bundler.js:1149:22)
    at C:\tools\isobuild\bundler.js:858:34
    at Object.enterJob (C:\tools\utils\buildmessage.js:388:12)
    at ServerTarget.make (C:\tools\isobuild\bundler.js:852:18)
    at C:\tools\isobuild\bundler.js:3258:14
    at C:\tools\isobuild\bundler.js:3392:24
    at Object.capture (C:\tools\utils\buildmessage.js:283:5)
    at bundle (C:\tools\isobuild\bundler.js:3214:31)
    at C:\tools\isobuild\bundler.js:3157:32
    at Slot.withValue (C:\Users\Michael\AppData\Local\.meteor\packages\meteor-tool\2.1.0\mt-os.windows.x86_64\dev_bundle\lib\node_modules\@wry\context\lib\context.js:73:29)
    at Object.withCache (C:\Users\Michael\AppData\Local\.meteor\packages\meteor-tool\2.1.0\mt-os.windows.x86_64\tools\fs\tools\fs\files.ts:1663:39)
    at Object.bundle (C:\tools\isobuild\bundler.js:3157:16)
    at C:\tools\runners\run-app.js:581:24
    at Function.run (C:\Users\Michael\AppData\Local\.meteor\packages\meteor-tool\2.1.0\mt-os.windows.x86_64\tools\tool-env\tools\tool-env\profile.ts:289:14)
    at bundleApp (C:\tools\runners\run-app.js:580:34)
    at AppRunner._runOnce (C:\tools\runners\run-app.js:627:35)
    at AppRunner._fiber (C:\tools\runners\run-app.js:948:28)
    at C:\tools\runners\run-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:\Users\Michael\AppData\Local\.meteor\packages\akryum_vue-component\0.15.2\plugin.vue-component.os\npm\node_modules\meteor\vue-component\node_modules\async\dist\async.js:3110:16
   at replenish
   (C:\Users\Michael\AppData\Local\.meteor\packages\akryum_vue-component\0.15.2\plugin.vue-component.os\npm\node_modules\meteor\vue-component\node_modules\async\dist\async.js:1011:17)
   at
   C:\Users\Michael\AppData\Local\.meteor\packages\akryum_vue-component\0.15.2\plugin.vue-component.os\npm\node_modules\meteor\vue-component\node_modules\async\dist\async.js:1016:9
   at Object.eachLimit$1
   (C:\Users\Michael\AppData\Local\.meteor\packages\akryum_vue-component\0.15.2\plugin.vue-component.os\npm\node_modules\meteor\vue-component\node_modules\async\dist\async.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:\Users\Michael\AppData\Local\.meteor\packages\akryum_vue-component\0.15.2\plugin.vue-component.os\npm\node_modules\meteor\vue-component\node_modules\async\dist\async.js:3110:16
   at replenish
   (C:\Users\Michael\AppData\Local\.meteor\packages\akryum_vue-component\0.15.2\plugin.vue-component.os\npm\node_modules\meteor\vue-component\node_modules\async\dist\async.js:1011:17)
   at
   C:\Users\Michael\AppData\Local\.meteor\packages\akryum_vue-component\0.15.2\plugin.vue-component.os\npm\node_modules\meteor\vue-component\node_modules\async\dist\async.js:1016:9
   at Object.eachLimit$1
   (C:\Users\Michael\AppData\Local\.meteor\packages\akryum_vue-component\0.15.2\plugin.vue-component.os\npm\node_modules\meteor\vue-component\node_modules\async\dist\async.js:3196:24)
   at VueCompo.processFilesForTarget
   (packages/vue-component/plugin/vue-compiler.js:41:11)

NightCatSama / vue-slider-component

TypeError for typescript Error while compiling in tag <script> using lang ts Cannot read property 'data' of null #437

TypeError for typescript