关于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

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐