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