vue3 引入外部js

在 Vue3 中引入外部 JS 文件的方法与 Vue2 有所不同。Vue3 推荐使用 ES6 的模块化方式引入外部 JS 文件，这样可以利用浏览器的模块化加载机制，提高应用的性能和可维护性。

以下是引入外部 JS 文件的步骤：

1. 在 Vue3 项目的 public 目录下创建一个 js 目录，将需要引入的 JS 文件放入该目录下。

2. 在组件中使用 import 语句引入需要的 JS 文件。

3. 使用 import 语句引入的 JS 文件会自动被打包，可以直接在组件中使用。

例如，在组件中引入一个名为 `example.js` 的 JS 文件，可以按照以下步骤进行操作：

1. 将 `example.js` 文件放入项目的 public/js 目录下。

2. 在组件中使用以下语句引入 `example.js` 文件：

import example from "@/js/example.js";

3. 然后就可以在组件中使用 `example` 对象了。

需要注意的是，如果引入的 JS 文件依赖于其他的库或模块，需要先安装这些依赖，并在引入文件之前先引入这些依赖。另外，如果引入的 JS 文件需要在全局范围内使用，可以将其挂载到 Vue 实例的原型上，这样就可以在任意组件中使用了。