vue3 如何引入静态js文件

在Vue 3项目中引入静态JavaScript（JS）文件通常有两种常见的方式，取决于你是想在整个应用中全局引用还是仅在特定组件中使用：

1. **全局引入** (CommonJS):
- 如果你在使用脚手架如Vue CLI，可以在项目的`src/assets`目录下创建一个新的JavaScript文件，并在`main.js`或`vite.config.js`（如果使用Vite）中通过`import`引入。例如：

     import('./your-js-file.js');

- 或者在Webpack配置中使用`externals`属性将外部库标记为无需打包，只在浏览器环境下作为独立资源引用。

2. **局部引入** (ES6模块):
- 在单个组件中，直接在`<script>`标签内使用`import`，如：

     <script type="module">
       import yourJs from './components/path/your-js-file.js';
       // 在组件内部使用 yourJs
     </script>

- 使用`async`和`await`处理异步加载，避免阻塞渲染：

     <script type="module" async>
       await import('./your-js-file.js');
       //...
     </script>