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



我通过 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

索引中出现错误.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

这是我的演示文件:

首页

<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"]
}

每次启动时都会清理dist.cache根目录中的目录。

包.json

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

最新更新