3

前端灵异事件 好好的代码就我跑不起来?

 2 years ago
source link: https://segmentfault.com/a/1190000040660041
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
  • 前端灵魂拷问:

同一个项目,同一份代码,别人电脑上能跑,为什么自己电脑上就不行?

同一个项目,同一份代码,别人自己电脑上打包构建,为什么服务器上就不行?

Peter老司机这次带你们深刻的分析这个问题

那原因是什么啊?

原因一般不止一个,可能你当时出现问题,是姿势不对,又或者是环境问题,又或者是同事的操作不规范等等情况,我们接下来一一道来。

看之前记得来波关注:


原罪之一:npm/yarn等使用不规范

前端的依赖通过npm/yarn等包管理器来安装时,没有锁定版本,例如你的同事安装依赖时:

yarn add react --save 

那么这个版本到底是什么?众所周知,react在18版本之前,不能同时存在两个react,否则会报错,直接白屏

当同事使用yarn安装react时候,会生成一份yarn.lock文件,用于锁定这次安装的react版本信息,可是这个时候你把代码克隆下来,使用npm安装,然后启动项目,发现项目本身的react版本和其他第三方库的react版本不兼容,这个时候你就跑不起来了。

所以:多人开发协作,要统一包管理器,统一使用一份lock文件,用git管理这个文件来锁定依赖安装版本
另外,安装依赖时候尽量锁定版本,例如:

yarn add [email protected] --save 

同理:当你的构建机器和本地开发机器使用的命令不一样时候,也会导致这个问题,例如本地使用yarn install,构建机器使用npm instasll

原罪之二:Node.js版本不一致

目前前端的工程化,都是大部分基于Node.js环境,node.js的版本发布升级很快,新老版本的api不兼容很正常,例如你的电脑上是16版本的nodejs,搭配了比较新的webpack版本,那样可以正常使用,但是一上构建机器,或者去了同事那边版本比较旧的电脑,就跑不起来了。

推荐使用nvm管理node.js版本,让电脑上存在多个nodejs版本

原罪之三:特殊环境配置

例如,电脑上缺少hosts配置,这个项目本身需要跑在特定的host上,但是你的电脑没有写入配置,就会导致项目无法启动

原罪之四:特定依赖源无法下载

这种要分情况:

一种是真的源在国外,比较慢,会经常超时,无法下载,也就无法启动(例如前端之痛node-sass

安装的时候可以指定源地址为淘宝镜像:

npm install -g mirror-config-china --registry=http://registry.npm.taobao.org

npm install sass-loader node-sass -D

一种是私有镜像源做了保护,在公网没有权限访问,安装时候控制台报401,需要开公司VPN

原罪之五:特定依赖下载后编译很久,或者无法编译通过

例如windows安装依赖时候提示:是没有安装python2.7环境

此时,你只需要执行这一条命令就会给你安装python环境

npm install --global --production windows-build-tools

跨平台开发,首选Mac电脑,会为你提前解决很多环境问题

原罪之六:端口被占用

外面有可能会同时启动多个项目,例如:当项目占用端口8080后,后面再启动项目,就会报端口倍占用

这个时候你需要调整启动的端口即可

相信通过这六点总结,能解决你大部分项目中同一份代码却跑不起来的问题,要知道项目能在别人电脑上跑起来,你的电脑也一定可以。如果不可以,就是你的姿势问题

记得帮我公众号:前端巅峰来个:在看/赞/关注


About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK