Question

我正在将Nuxt与Typescript一起使用。我创建以下组件：

<template>
    <div class="field">
        <label class="label" v-if="typeof label !== 'undefined'">{{ label }}</label>
        <div class="control">
            <textarea
                v-if="inputType === 'textarea'"
                class="textarea"
                @input="$emit('input', $event.target.value)"
            ></textarea>
            <input
                v-if="inputType === 'input'"
                :type="type"
                class="input"
                @input="$emit('input', $event.target.value)"
            >
        </div>
    </div>
</template>

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

@Component({})
export default class AppInput extends Vue {
    @Prop({ type: String, required: false, default: "input" })
    inputType!: string

    @Prop({ type: String, required: false })
    label!: string

    @Prop({ type: String, required: false, default: "text" })
    type!: string
}
</script>

<style>
</style>

然后在@/plugins/components.ts中，按如下所示导入组件：

import Vue from "vue"
import AppInput from "@/components/Forms/AppInput.vue"

Vue.component("AppInput", AppInput)

当我使用Nuxt编译项目时，它引发了export 'default' (imported as 'mod') was not found错误。请帮忙！

Answer 1

您将需要在vue文件中至少保留一个空的导出默认脚本，以免出现此错误。如果您没有任何导出默认语句，则会给出此错误/警告。

export default {

}

Answer 2

我使用以下tsconfig解决了问题：

{
    "compilerOptions": {
        "target": "esnext",
        "module": "esnext",
        "moduleResolution": "node",
        "lib": ["esnext", "esnext.asynciterable", "dom"],
        "esModuleInterop": true,
        "experimentalDecorators": true,
        "allowJs": true,
        "sourceMap": true,
        "strict": false,
        "allowSyntheticDefaultImports": true,
        "noImplicitAny": false,
        "noEmit": true,
        "baseUrl": ".",
        "resolveJsonModule": true,
        "paths": {
            "~/*": ["./*"]
        },
        "types": ["@nuxt/vue-app", "@types/node", "@types/webpack-env"]
    }
}

Answer 3

一切正常，突然之后开始出现错误

npm run dev

在以下位置找不到“导出'默认'（导入为'mod'）” '-！../ node_modules / babel-loader / lib / index.js ?? ref--2-0！../ node_modules / vue-loader / lib / index.js ?? vue-loader-options！./ default.vue？vue＆type = script＆lang = js＆'

我不知道这是否是一个很好的解决方案，但我所做的最后一次更改是

<template>之后的第一个div更改为<div id="my-app">

所以我再次将div id还原为<div id="app">，该错误消失了，

希望它将对某人有所帮助。

找不到Nuxt导出“默认”（导入为“ mod”）

3 个答案: