在 vue 组件中使用包含类的自己的 JS 文件

Question

我有一个 js 文件，其中包含一些带有函数的类。 我有一个 vue 组件，我喜欢在其中创建该类的实例。 （如果我将文件直接复制粘贴到我的标签中，一切运行正常

我的文件.js

class myclass{
  
  constructor(x){
      this.x=x
    }
}

在我想使用的 vue 组件脚本标签中

<script>
..
mounted(){
    let myinstance = new myclass("hi") 
    console.log(myinstance.x) 

}
..
</script>

-- 从这里我说到目前为止我尝试过的（没有成功），如果你喜欢解决方案，可以跳过--

<script>
import myclass from "myfile.js"

信息失败，我应该先安装 js 文件。

我试过了，但失败了，因为他想要一个 package.json。

我在 myfile.js 所在的同一文件夹中创建了一个 package.json

{
  "name"        : "myfile",
  "version"     : "0.0.1",
  "main"        : "myfile.js",
  "scripts"     : {
  },
  "dependencies": {
  }
}

但它失败了 Could not install from "....\src\baujs\myfile.js" 因为它不包含 package.json 文件。

我尝试了许多不同的变体，但似乎我搜索的方向错误。如果有人能引导我朝着正确的方向前进，那就太好了。提前致谢

Answer 1

阅读更多关于 JS 模块的信息here

首先你需要导出你的类

我的文件.js

export class myclass{
  
  constructor(x){
      this.x=x
    }
}

然后导入

import { myclass } from "myfile.js"