Vue导出默认通过包裹在打字稿中失败

时间:2018-07-09 10:54:19

标签: typescript vue.js parcel

我通过Parcel使用vue + TypeScript运行演示,并在引导成功后在浏览器中抛出错误:

vue.runtime.esm.js:7878 Uncaught TypeError: Cannot read property 'split' of undefined
    at Object.exports.install (vue.runtime.esm.js:7878)
    at Home.vue:17
    at Object.parcelRequire.11.vue-hot-reload-api (Home.vue:17)
    at newRequire (main.54d39494.js:48)
    at localRequire (main.54d39494.js:54)
    at Object.parcelRequire.2.vue (Home.vue:17)
    at newRequire (main.54d39494.js:48)
    at parcelRequire.11 (main.54d39494.js:80)
    at main.54d39494.js:106

错误发生在 index.js

exports.install = function (vue, browserify) {
  if (installed) { return }
  installed = true

  Vue = vue.__esModule ? vue.default : vue
  version = Vue.version.split('.').map(Number) // Vue.version is undefined

这是我的演示文件:

Home.vue

<template>
  <div class="home">
    <img src="../assets/logo.png">
    <HelloWorld msg="Welcome to Your Vue.js + TypeScript App"/>
  </div>
</template>

<script lang="ts">
import { Component, Vue } from 'vue-property-decorator';
import HelloWorld from '../components/HelloWorld.vue'

@Component({
  components: {
    HelloWorld,
  },
})
export default class Home extends Vue {}
</script>

export default怎么了?

打字稿配置有什么问题吗?

tsconfig.json

{
  "compilerOptions": {
    "allowSyntheticDefaultImports": true,
    "baseUrl": ".",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "jsx": "preserve",
    "module": "esnext",
    "moduleResolution": "node",
    "noImplicitReturns": true,
    "sourceMap": true,
    "strict": true,
    "target": "esnext",
    "paths": {
      "@/*": ["src/*"]
    },
    "lib": ["esnext", "esnext.array", "dom", "dom.iterable", "scripthost"]
  },
  "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.vue", "tests/**/*.ts", "tests/**/*.tsx"],
  "exclude": ["node_modules"]
}

1 个答案:

答案 0 :(得分:1)

每次启动时都要在根目录下清洁dist.cache目录。

package.json

  "scripts": {
    "clean": "rm -rf .cache && rm -rf dist",
    "prestart": "yarn clean",
    "start": "parcel public/index.html",
    "build": "parcel build public/index.html"
  },