A. web前端項目部署到伺服器：
執行成功後會生成dist文件
4.1 進入到nginx配置目錄：/usr/local/nginx/conf,對 nginx.conf 文件進行配置
使用include可以配置多個.conf文件，如一個項目一個配置文件。在同目錄下創建demo文件夾，並創建demo.conf配置文件
下面使用是以ip地址的方式創建的的配置文件
訪問地址：
其中dist名稱時可以修改，保持與/usr/local/nginx/html下cp名稱一致，否則會訪問不到;並且/usr/local/nginx/html目錄可存在同一ip下多個web項目。
域名與ip綁定
配置域名demo.conf
eg: 域名 - demo.cn
4.2阿里雲配置域名前綴
阿里雲->域名->域名列表—>域名 管理-> 域名解析->解析設置
如圖：記錄值 填寫當前服務ip
學習過程中所記錄，有問題或者有好的方式歡迎指點。不勝感激 🤗 🤗 🤗
B. 如何把項目部署到遠程伺服器上
步驟如下：
1、確保項目在MyEclipse上能夠正常運行。
2、在Tomcat安裝目錄下的webapp目錄中新建一個文件夾。
3、將META-INF文件夾、WEB-INF文件夾及所有的前端代碼復制到第2步新建的文件夾中。
4、將build中的classes文件夾復制到WEB-INF文件夾中。
5、啟動Tomcat即可訪問，外網使用IP+埠也可以訪問。
C. 前端自動化部署伺服器, 告別繁瑣部署過程
簡單實用的前端部署, 一條命令搞定, 省去繁瑣的步驟!
主要是** nodejs shelljs(命令行命令) node-ssh(連接伺服器)**
項目git 地址
(這個git項目是我自己搭的一個比較low的vue腳手架,集成ts)
(第一次寫文章, 文筆不行, 多多包涵,有不對的地方盡管指出)
(主要看 自動部署 在 upload 目錄 )
npm 或 cnpm i chalk ora shelljs node-ssh inquirer compressing -D
大功告成~~
咳咳, 放心, 不會有公眾號啥廣告, 也不會求打賞, 如果您覺得對您有一點點幫助 點個贊或者去GitHub點個star 那就非常感謝了
項目git 地址
D. 如何把做好的前端網頁上傳到伺服器上，讓別人可以像瀏覽百度、新浪等各大網頁一樣可以訪問得到
= =。首先你要有一個公網IP的伺服器(重要，否別人無法直接在網址上訪問你的頁面)
linux 是伺服器，用來24開機提供服務。
apache是引擎，用來提供別人訪問你的網址能有東西出來。
ftp用來把你寫的代碼上傳到linux上面去，有了這一步你的東西才能在伺服器上被別人訪問到。
只要遠程目錄上有你的東西就是上傳成功了，埠默認是21
或者你可以上網買一些虛擬主機，有二級域名可以穿透，也可以外網訪問
E. 怎麼把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 即可
F. vue項目要部署在伺服器上，那麼伺服器需要安裝node.js環境嗎
最好是安裝一個。
1.如果你僅僅是打包好的vue相機，那麼要看服務端使用的是什麼語言，如果是node的話，肯定要安裝node環境的，但是如果不是node，那麼就沒有必要了。
2.如果你想在服務端跑vue的項目，也就是在遠程端做開發工作，那麼肯定是要安裝node的，畢竟vue開發環境需要node。
基本上服務端也就這兩種需求，node包其實很小，安裝一個也不費事，還可以方便開發，我覺得在遠程端按一個最好。
G. webpack打包後的代碼，如何部署到伺服器上
本文章前端代碼是基於vue+webpack開發的
Nginx是一款輕量級的Web 伺服器/反向代理伺服器
首先，webpack配置如下
在開發過程中，我們是通過npm run dev在開發環境中運行代碼
如果要部署到生產環境中，可以運行npm run build進行上線打包
打包完成後，會發現項目中多了dist這個文件夾
執行結果和webpack的配置文件一致。
代碼被webpack打包完成後下一步就是部署到伺服器上，此文僅適合於前端代碼是部署在windows操作系統的nginx服務中。
這里假設：
Windows操作系統：windows server 2008 64位
Nginx服務：nginx-1.12.2 64位
1.下載nginx-1.12.2 64位解壓，假設nginx-1.12.2放在D:nginx-1.12.2目錄中，nginx目錄結構。如圖下
2、前端代碼放在D:nginx-1.12.2html目錄中，dist目錄就是剛剛前端打包完的代碼。如圖下
3、在D:nginx-1.12.2conf目錄中，有個nginx.conf配置文件，進行編輯這個文件
4、假設前端的埠號為8082，如果埠號被佔用，請修改為其它埠號。後台服務訪問地址http://192.168.121.**:8080,
5、打開cmd控制台，進入目錄D:nginx-1.12.2中，用start nginx命令啟動服務，然後用tasklist /fi "imagename eq nginx.exe"，查看nginx服務是否啟動。
4、如果改變配置文件時，需要用nginx -s reload 命令重啟nginx工作進程。
5、關閉服務
nginx -s stop
nginx -s quit 安全關閉
taskkill /F /IM nginx.exe > nul 關閉所有nginx服務
H. 前端通過gulp編譯後的文件，怎麼部署到伺服器
伺服器上寫部署腳本，從代碼庫里拉項目代碼，跑gulp自動化。或者打包傳給後端讓他搞。
I. 一個前端頁面如何部署
一個前端頁面，在本地直接打開就能訪問。另外如果是要放到伺服器下的話，可以裝個nginx，或者apache，或者tomcat，直接放到網頁路徑下，就行。
J. 前端打包之後的代碼放到伺服器上請求路徑不對
這個應該是設置了代理 或者是配置錯了 可以看看配置文件 或者封裝ajax的地方是不是設置了默認根路徑