关于Vite 客户端不支持node内置模块path的处理

js客户端代码使用了path模块

import 'path' from 'path'
...
path.resolve(basePath,path)

浏览器控制台报了以下错误
Uncaught (in promise) Error: Module “path” has been externalized for browser compatibility and cannot be accessed in client code.
具体是说为了浏览器兼容性,path 模块无法在客户端代码中使用

解决方案

下载 path-browserify 作为代替

 npm install path-browserify --save

修改导入模块

import 'path' from 'path-browserify'

之后就可以正常使用了。

总结:

vue-cli 使用 webpack 构建项目, webpack 自动帮我们处理了node内置模块,但是vite没有,因此需要我们用替代库。
具体可以查看
github.com/vitejs/vite/issues/2172

其他

社区编写了一个支持vite使用commonjs的插件,具体如下
github.com/xiaoxiangmoe/vite-plugin-commonjs-externals

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐