‘vite‘ 不是内部或外部命令,也不是可运行的程序或批处理文件。 —— 本地有vite环境但却跑不起项目?

先说结论

一般为了节流等多方面原因,项目打包时一般不会包括node模块,git管理进行push推送时也不会对node_modules文件夹进行推送,所以一般接手一个项目需要使用npm i先补好项目所需包环境再进行测试,很微不足道的一个细节,但是新手容易踩坑还意识不到问题出在哪。

为什么不打包node模块

在Vue项目中,通常不会将node_modules中的所有模块打包进最终的生产环境文件中,原因主要有以下几点:

  1. 体积和性能node_modules中包含了项目开发过程中用到的所有依赖包,这些包的体积可能非常大。将这些依赖打包进最终的生产文件中会导致文件体积大幅增加,影响加载性能。

  2. 环境差异:开发环境和生产环境通常有不同的依赖需求。例如,一些用于调试的库(如vue-devtools)不需要包含在生产环境中。

  3. 依赖复用:在服务器环境中,可以预先安装好这些依赖,因此不需要再次打包。这样可以利用服务器上可能已经存在的依赖版本,避免重复打包。

  4. 安全性:减少打包体积可以降低包含恶意代码的风险,因为更小的打包体积意味着更少的代码需要审查。

  5. 构建速度:不打包node_modules可以加快构建速度,因为构建过程中需要处理的文件数量减少了。

  6. 树摇(Tree Shaking):现代打包工具支持树摇,可以移除代码中未引用的部分,这样可以进一步减小打包后的文件体积。

为了在打包时排除node_modules,可以使用一些webpack插件,如webpack-node-externals,或者在webpack配置中使用externals字段来指定外部依赖。这样可以告诉webpack在打包时不要包含这些模块,而是在运行时从环境中获取。

在实际开发中,通常会通过配置vue.config.js文件来优化打包过程,例如使用externals配置来排除node_modules中的模块,或者使用CompressionWebpackPlugin插件来生成gzip压缩文件,以便于服务器端的压缩和传输。

总的来说,不将node_modules打包进Vue项目的生产文件中是一种常见的优化手段,可以显著减少最终文件的体积,提高应用的加载速度和运行效率。

.gitignore文件

在Git管理中,通常不推荐将node_modules目录推送到远程仓库,原因包括:

  1. 大小和性能node_modules目录通常包含大量的依赖文件,这会显著增加仓库的大小,导致克隆或拉取仓库时速度变慢。
  2. 环境一致性:不同的开发环境可能需要不同版本的依赖,将node_modules纳入版本控制会限制这种灵活性。
  3. 避免冗余:通过package.jsonpackage-lock.json文件,团队成员可以重现相同的node_modules目录,无需将其纳入版本控制。
  4. 安全性:减少不必要的文件上传,可以降低敏感信息泄露的风险。

为了不将node_modules目录推送到远程仓库,通常会在项目根目录下创建一个.gitignore文件,并在该文件中添加node_modules/规则。
‘vite‘ 不是内部或外部命令,也不是可运行的程序或批处理文件。 —— 本地有vite环境但却跑不起项目?_第1张图片
这样,Git在提交时就会忽略这个目录。如果node_modules已经被错误地提交到了远程仓库,可以使用以下命令将其从Git历史中移除:

git rm -r --cached node_modules
git commit -m "Remove node_modules from repository"

这些命令会将node_modules目录从Git的跟踪中移除,但保留在本地文件系统中。然后,可以继续提交.gitignore文件以确保node_modules在未来不会被包含在版本控制中。如果需要重新安装依赖,可以使用npm installyarn命令来根据package.json文件重新构建node_modules目录。

你可能感兴趣的:(前端,npm,vue,node.js)