大公司里怎样开发和部署前端代码?

主要有以下问题: 开发时的和部署时类库的引用和存放是一致还是不同? 模块放在项目中还是放在 CDN 之类服务器? 渲染网页用 Nginx 还是其他动态语言的 Web 服务器? 制作网页的流程,是先有设计师的稿,还是先看模块? 会选择用自己写的模块还是从社区寻找模块?
关注者
10338
被浏览
371414
目前 负责天猫模块方案,大概回答下答主的问题。
  • 开发时的和部署时类库的引用和存放是一致还是不同?
开发时和部署时,类库的的引用和存放是看起来一致,但是背后其实不一样。
天猫由于业务对模块的线上搭建的需求比较强烈,大部分场景下没法走本地打包,都用的存放在CDN的模块。
本地开发的时候,文件host会指到本地,引用的模块会从服务端拉取到本地(提高下次读取的速度,这部分工作由本地的开发server完成),但是引用的方式是和线上一样的。
本地开发时:
const overly = require('mui/overlay/index');
打包到线上
define('xxx', ['mui/overlay/index'], function(require){
  var overly = require('mui/overlay/index');
})
请求模块的url都是
http://g.alicdn.com/mui/overlay/4.0.0/index.js
  • 模块放在项目中还是放在 CDN 之类服务器?
内部依赖模块放到项目中,公共模块放CDN。
其实这么描述有些抽象,但是也给了开发者足够的自由。
  • 渲染网页用 Nginx 还是其他动态语言的 Web 服务器?
现在貌似这个问题没什么好讨论的。
本地开发环境最好和服务端架构保持一致,现在服务端是Node,本地肯定也是Node。
  • 制作网页的流程,是先有设计师的稿,还是先看模块?
最理想的情况下,设计师应当花比较多的时间和前端一起维护一套模块UI规范,然后设计师设计页面的时候,也必须根据这个模块UI规范来。
所有有个性化的调整,都应当考虑是不是应当补充回到UI规范中,保证整体视觉的一致性体验。
当然,总有不合适和一些特殊场景下的视觉稿,就单独处理好了。
所以应该是在设计师的稿子上体现模块,而不是到前端才来看哪些模块和视觉稿能匹配上。
  • 会选择用自己写的模块还是从社区寻找模块?
对于模块,社区方案一定是非常棒的,所以在没有现成的情况下,非常建议引入社区模块,并在引入之后维护起来。
后面一点维护起来非常重要,引入一个模块很简单,维护起来就不是了,或许你会发现这个社区模块有一些bug,或者是部分不满足需求,去修改并改善这个模块比重写一个模块要求更高,难度更大(你要理解其他开发者为什么要这么写代码)。完成之后提MR到社区也是对社区的贡献。
自己写的情况也有,但更多还是要考虑自己写的意义在哪里,一般在社区模块落后于你对模块的思考和规划时,自己写是一个好的选择。