在 Vue 组件中导入外部类时出错答案

【问题标题】：Error Importing External Class in Vue Component在 Vue 组件中导入外部类时出错
【发布时间】：2019-08-09 00:48:30
【问题描述】：

我正在尝试将包含表单类的外部 javascript 文件导入到 Vue 组件。

文件结构：

js
- components
-- dashboard
--- dashboard.vue
- app.js
- form.js

我已经尝试过了，但仍然返回错误。

import Form from '../../form.js'
import Form from '../../form'
import Form from './form'

form.js


export default class Form{
    // Code Here
}

dashboard.vue

<template>
    // Code
</template>

<script>
   import Form from '../../form.js' <- not working
   import Form from '../../form'    <- not working
   import Form from './form'        <- not working

   export default{
      name: 'Dashboard',
      data(){
         return [
           form: new Form({
               field1: '',
               ...
           })
         ]
      }
   }
</script>

请帮忙，非常感谢

【问题讨论】：

form.js 在 js 文件夹之外吗？我觉得应该是import Form from '../../../form.js'
form.js 在 js 文件夹内，抱歉造成混淆。将更新描述。
只是为了确定：错误消息说什么？其他进口是否有效？代码对我来说看起来不错。 import Form from '../../form.js' 应该可以工作，我猜。

标签： javascript vue.js import vue-component

【解决方案1】：

您必须导出要使用的类。

export class className {}

和

import {className} from '<file path>';

【讨论】：