vite项目中引入本地js文件报错的解决方法

在将Vue2项目迁移到Vite后，您可能会遇到引入本地JS文件（例如echarts.min.js和crc32.js）时报错的问题，提示“未受限的文件系统访问”。这是因为Vite出于安全考虑，默认限制了对文件系统的直接访问。

问题原因：

Vite的安全策略限制了对未经授权的文件系统访问。 为了增强安全性，Vite对可访问的文件路径进行了限制。

vue-composition-api-best-practices

Vue 3 组合式 API 与 最佳实践，涵盖代码组织、useXxx 模式、组合式函数设计、Store 集成、响应式优化及功能抽取。

下载

解决方案：

使用相对路径导入本地JS文件，而不是绝对路径。 这将绕过Vite的文件系统访问限制。

<code class="javascript">// 例如，假设echarts.min.js和crc32.js位于项目根目录下的static文件夹中
import echarts from './static/echarts.min.js';
import crc32 from './static/crc32.js'; </code>

通过使用相对于当前文件的相对路径，Vite能够正确地找到并加载这些JS文件。 请确保您的文件路径正确，并根据实际情况调整路径。 如果您的文件不在static文件夹中，请相应地修改路径。