‘壹’ 一个前端页面如何部署
一个前端页面，在本地直接打开就能访问。另外如果是要放到服务器下的话，可以装个nginx，或者apache，或者tomcat，直接放到网页路径下，就行。
‘贰’ nginx怎么部署前端项目
1、安装护卫神·nginx大师
2、开设站点，绑定和解析域名
3、上传前端页面到网站
‘叁’ 常见的前端集成部署方案有哪些各自的优缺点是什么
前端行业经历了这么长时间的发展，技术元素非常丰富，这里列举出一般web团队需要用到的技术元素：
开发规范：包括开发、部署的目录规范，编码规范等。不要小瞧规范的威力，可以极大的提升开发效率，真正优秀的规范不会让使用者感到约束，而是能帮助他们快速定位问题，提升效率。
模块化开发：针对js、css，以功能或业务为单元组织代码。js方面解决独立作用域、依赖管理、api暴露、按需加载与执行、安全合并等问题，css方面解决依赖管理、组件内部样式管理等问题。是提升前端开发效率的重要基础。现在流行的模块化框架有requirejs、seajs等。
组件化开发：在模块化基础上，以页面小部件(component)为单位将页面小部件的js、css、html代码片段放在一起进行开发、维护，组件单元是资源独立的，组件在系统内可复用。比如头部(header)、尾部(footer)、搜索框(searchbar)、导航(menu)、对话框(dialog)等，甚至一些复杂的组件比如编辑器(editor)等。通常业务会针对组件化的js部分进行必要的封装，解决一些常见的组件渲染、交互问题。
组件仓库：有了组件化，我们希望将一些非常通用的组件放到一个公共的地方供团队共享，方便新项目复用，这个时候我们就需要引入一个组件仓库的东西，现在流行的组件库有bower、component等。团队发展到一定规模后，组件库的需求会变得非常强烈。
性能优化：这里的性能优化是指能够通过工程手段保证的性能优化点。由于其内容比较丰富，就不在这里展开了，感兴趣的同学可以阅读我的这两篇文章 [1] [2]。性能优化是前端项目发展到一定阶段必须经历的过程。这部分我想强调的一点是性能优化一定是一个工程问题和统计问题，不能用工程手段保证的性能优化是不靠谱的，优化时只考虑一个页面的首次加载，不考虑全局在宏观统计上的优化提升也是片面的。
项目部署：部署按照现行业界的分工标准，虽然不是前端的工作范畴，但它对性能优化有直接的影响，包括静态资源缓存、cdn、非覆盖式发布等问题。合理的静态资源资源部署可以为前端性能带来较大的优化空间。
开发流程：完整的开发流程包括本地开发调试、视觉效果走查确认、前后端联调、提测、上线等环节。对开发流程的改善可以大幅降低开发的时间成本，工作这些年见过很多独立的系统（cms系统、静态资源推送系统）将开发流程割裂开，对前端开发的效率有严重的阻碍。
开发工具：这里说的工具不是指IDE，而是工程工具，包括构建与优化工具、开发-调试-部署等流程工具，以及组件库获取、提交等相关工具，甚至运营、文档、配置发布等平台工具。前端开发需要工具支持，这个问题的根本原因来自前端领域语言特性（未来我会单独写一篇文章介绍前端领域语言缺陷问题）。前端开发所使用的语言（js、css、html）以及前端工程资源的加载与定位策略决定了前端工程必须要工具支持。由于这些工具通常都是独立的系统，要想把它们串联起来，才有了yeoman这样的封装。前面提到的7项技术元素都直接或间接的对前端开发工具设计产生一定的影响，因此能否串联其他技术要素，使得前端开发形成一个连贯可持续优化的开发体系，工具的设计至关重要。
‘肆’ 如何把webpack前端工程部署到tomcat上
几种方法：
1、在myeclipse里部署
这个直接在myeclipse里配置好tomcat的根路径。
在server里可以看到tomcat，选择部署你的工程就行了。
2、把自己的web工程放在tomcat的webapps下
2.1 把你的工程达成war包，放进tomcat的webapps下；
2.2 把你工程的webroot下的内容用你的工程名称（其实是你想要的在啊浏览器访问的应用路径名）作为文件夹包住webroot下的内容（要保证你的classes有东西，lib有东西）
3、把描述自己工程的context放在webapps下
context里可以描述你的工程的名称，工程存放的路径
4、在tomcat的conf/server.xml配置相应的context元素
这个和3的作用差不多，只是这个是在tomcat的server启动时加载的
以上都能让tomcat知道自己有多少应用要部署，将会进行相应的部署动作。部署完后，就可以在浏览器访问了。
‘伍’ 如何用Tomcat部署前端静态文件
几种方法： 1、在myeclipse里部署 这个直接在myeclipse里配置好tomcat的根路径。 在server里可以看到tomcat，选择部署你的工程就行了。 2、把自己的web工程放在tomcat的webapps下
‘陆’ 网站的前端服务器是什么意思，怎么和后端服务器配合
前后端分离部署时，服务器A用于部署前端项目，称为前端服务器，服务器B用于部署后端项目，称为后端服务器。后端服务器通过开放API的方式，向前端服务器中的前端项目提供数据或数据操作接口，以此实现前端与后端的衔接。若受项目的成本限制，将前端项目与后端项目部署在同一服务器上也是可以的，可以通过nginx等反向代理服务器根据访问地址进行分发。
‘柒’ 怎么把VUE项目部署到服务器上面
1.使用xshell登录到阿里云服务器。安装nginx（本文安装到/etc下）
[plain]view plain
cd/etc
apt-getupdate
apt-getinstallnginx
vim/etc/nginx/nginx.conf
userwww-data;
worker_processesauto;
pid/run/nginx.pid;
events{
worker_connections768;
#multi_accepton;
}
http{
##
#BasicSettings
##
tcp_nodelayon;
keepalive_timeout65;
types_hash_max_size2048;
#server_tokensoff;
#server_names_hash_bucket_size64;
#server_name_in_redirectoff;
include/etc/nginx/mime.types;
default_typeapplication/octet-stream;
##
#SSLSettings
##
ssl_protocolsTLSv1TLSv1.1TLSv1.2;#DroppingSSLv3,ref:POODLE
ssl_prefer_server_cipherson;
##
#LoggingSettings
##
access_log/var/log/nginx/access.log;
error_log/var/log/nginx/error.log;
##
#GzipSettings
##
gzipon;
gzip_disable"msie6";
#gzip_varyon;
#gzip_proxiedany;
#gzip_comp_level6;
#gzip_buffers168k;
#gzip_http_version1.1;
##
#VirtualHostConfigs
##
gzipon;
gzip_disable"msie6";
#gzip_varyon;
#gzip_proxiedany;
#gzip_comp_level6;
#gzip_buffers168k;
#gzip_http_version1.1;
#gzip_typestext/plaintext/cssapplication/jsonapplication/javascripttext/xmlapplication/xmlapplication/xml+rsstext/javascript;
##
#VirtualHostConfigs
##
include/etc/nginx/conf.d/*.conf;
include/etc/nginx/sites-enabled/*;
#以下为我们添加的内容
server{
listen80;
server_nameyour-ipaddress;
root/home/my-project/;
indexindex.html;
location/datas{
rewrite^.+datas/?(.*)$/$1break;
includeuwsgi_params;
proxy_passhttp://ip:port;
}
}
}
assetsPublicPath:'/test1/',
exportdefaultnewRouter({
base:'/test1/',//添加这行
linkActiveClass:'active',
routes
});
consturl='/datas/seller';
this.$http.get(url).then((response)=>{
.....
});
servicenginxstart
2.首先先配置nginx，然后再根据配置文件做下一步操作
打开/etc/nginx/nginx.conf文件
[plain]view plain
在nginx.conf中配置如下：
[plain]view plain
接下来就根据配置文件进行下一步工作。配置文件中的server_name后面是阿里云服务器的ip地址
3.配置文件中的listen是nginx监听的端口号，所以需要在阿里云服务器上为80端口添加安全组规则
在本地的浏览器登录阿里云服务器->进入控制台->点击安全组->点击配置规则->点击添加安全组规则，之后配置如下（注：入方向和出方向都要配置）
4.配置文件中的root和index那两行表示我们把项目文件夹放在/home/my-project下
例如有两个项目文件夹分别为test1，test2，里面都有index.html。则目录结构如下
/home
|--my-project
|--test1
|--index.html
|--test2
|--index.html
则在浏览器输入http://ip/test1/index.html
服务器便会在/home/my-project中找到test1下的index.html执行；
如果在浏览器中输入http://ip/test2/index.html
服务器便会在/home/my-project中找到test2下的index.html执行；
这样便可以在服务器下放多个项目文件夹。
5.所以我们也需要在本地项目的config/index.js里的build下进行修改,如果要把项目放到test1下，则
[javascript]view plain
如果用到了vue-router，则修改/router/index.js
[javascript]view plain
6.nginx配置文件中的location则是针对跨域处理，表示把对/datas的请求转发给http://ip:port,本文中这个http://ip:port下就是需要的数据，例如http://ip:port/seller,在本地项目文件中ajax请求数据的地方如下
[javascript]view plain
7.修改后在本地命令行下运行:cnpm run build 生成dist文件。把dist文件里的index.html和static文件上传到服务器的/home/my-project/test1下，目录结构如下
/home
|--my-project
|--test1
|--index.html
|--static
8.启动nginx
[plain]view plain
9.至此项目部署成功，在浏览器下输入: http://ip/test1/index.html 即可
‘捌’ 前后端分离的前端是怎么部署到生产环境中的，直接通过 nginx 吗
front-end-separate(前后端分离脚手架)
front-end-separate
一个前后端分离的脚手架工具（自主研发）
为什么选择grunt而不是gulp
如果你也和我一样喜欢grunt这种配置的方式，那么我相信这个脚手架觉对十分适合你
所有静态资源都md5全并压缩打包,css,js,img,html
已在生产环境验证
基于express和grunt的前后端分离框架
模板引擎使用的是nunjucks，好处是可以实现模版继承，又不像jade一样把html标签都简化了
express提供路由服务
项目中app为原代码文件（开发用），dist为打包后的文件（用于线上）
开发使用app，线上使用dist，支持一键cdn部署，加速你的项目
项目启动时，修改任何express代码，可以实现自动重启–基于nodemon
支持sass图片精灵（自动打包精灵图片，再也不用手动去拼凑了）
基于grunt md5 打包合并
线上输出的html已经压缩成一行（让你的代码更有Geeker范）
‘玖’ 大公司里怎样开发和部署前端代码
虽然美团不是大公司，但在这里写一下我们的情况，仅供参考。开发时的和部署时类库的引用和存放是一致还是不同?开发环境和部署环境的类库代码都是相同的，但物理位置不同。部署环境的类库在CDN上，开发环境的类库在开发服务器上。模块放在项目中还是放在 CDN 之类服务器?模块放在项目中，部署时都在CDN上。渲染网页用 Nginx 还是其他动态语言的 Web 服务器?前面用ngnix做负载均衡，后面用apache做web服务器。制作网页的流程, 是现有设计师的稿, 还是先看模块?先有设计师的稿再写模块，但很多时候并不需要设计师，因为架子已经搭好了，界面规范和基础元素都有，一般的界面前端工程师都能搞得定。会选择用自己写的模块还是从社区寻找模块?基础框架用的YUI3，大部分二次开发的底层模块，还有和业务紧密结合的UI模块都是自己写的。当然也会用社区写的模块，比如上传组件、highcharts、Ace等。如果说怎么选择模块的话，那就是具体情况具体分析了，总体原则有两个：能不自己写，就不自己写；选择最符合需求的，一般来说，要么选最好的，要么选最快出结果的。
‘拾’ web前端开发项目过程
老板或甲方是一个需求的真正发起者，也是一个基础idea的梦想师，产品是需求专业化梳理或进行有效评估细化需求负责的，
而设计是前端的上游，前端是设计的下游。设计的工作目的是把产品宏观的思维结果进行专业的处理，因为按一般的习惯，产品最终的结果是原型图，而原型图可以理解为设计的草图，
对真正的用户来说，这个草图过于简单或不符合使用的操作习惯，所以需要设计师进行专业的处理，比如颜色搭配，布局分隔，有时候还兼交互的一部分工作，设置用户与页面发生交互的预订流程，
那有人问，不需要设计不行吗？直接让前端写页面不就得了，还需要麻烦设计师来做个图出来。
因为这里边有一个成本风险控制的一个理念，因为在前期，尤其是设计，主观感受大于理性的思考，所以每天的结果都不一样，所以需要设计师去消化掉这部分主观感受带来的误区，
而且从成本上来讲，有些场景设计师改图比改代码要容易控制一些。
设计师的结果是psd文件，他是很多个图层叠加在一起的结果，而前端的工作结果html页面，是把很多图层上的效果，有机的用html组织起来的过程。
前端是把转化后html交给下游服务端开发工程师，或叫后台开发，这个html里边包括一些交互的js文件等。总的来说前端是一个承前启后的岗位。
也有的公司把前端的责任放大，负责整个前台view层页面的开发，这样的好与坏在前面的文章中已经探讨过就不一一细表了。
我们以前基本的流程是，领导或甲方提出需求，然后产品分析需求，并且根据需求画出原型图，然后根据原型图出设计稿。
出完设计稿团队评审，过后交与前端制作静态页面，然后静态页面，交与设计审核，过后交给开发人员，进行动态数据的添加。
添加完之后，发布测试环境，产品测试领导审核，成功后，直接发布产品环境。或进行版本迭代。
这是整个的一个设计，开发，部署的流程。
根据前面的，在补充一下，前面的所有流程中的灵魂是原始需求提出者，但人随着客观条件的变化，思维认识会有所不一致，
所以产生了文档，文档是贯穿整个流程的一个灵魂。
而产品是整个流程中文档的编写者，因为产品最能接触最原始的需求，对需求的理解更深刻或专业，所以他会有一个文档出来。
这个文档是需要交付给设计，让设计在设计过程中进行参考。
前端看的另外一个文档。交互设计师出交互文档，一般的公司没有交互设计师那就是由产品来出的交互文档。
有的交互不过于复杂，就没有文档，只是邮件。
有时候说，不要这个邮件行不行，那怕是最简单的原始东西，没有文件或邮件是不能做一个后期测试回溯的依据。
产品文档表示页面的流转或数据的走向，交互文档描述页面复杂的交互或各个用户表单与用户发生的各种互动。
另外2个是，要架构师或项目经理出的需求文档，需求文档是对整个项目的历史背景，系统开发软硬件要求，或版本信息，等等。
另外一个是由服务端工程师提供的接口文档，这里边包括一些请求类型，传参的数目与键名，还有服务端返回的参数名约定等等的，这些文档是开发中的灵魂，也是以后测试回溯的标准或依据。