1. 大公司里怎樣開發和部署前端代碼
雖然美團不是大公司,但在這里寫一下我們的情況,僅供參考。開發時的和部署時類庫的引用和存放是一致還是不同?開發環境和部署環境的類庫代碼都是相同的,但物理位置不同。部署環境的類庫在CDN上,開發環境的類庫在開發伺服器上。模塊放在項目中還是放在 CDN 之類伺服器?模塊放在項目中,部署時都在CDN上。渲染網頁用 Nginx 還是其他動態語言的 Web 伺服器?前面用ngnix做負載均衡,後面用apache做web伺服器。製作網頁的流程, 是現有設計師的稿, 還是先看模塊?先有設計師的稿再寫模塊,但很多時候並不需要設計師,因為架子已經搭好了,界面規范和基礎元素都有,一般的界面前端工程師都能搞得定。會選擇用自己寫的模塊還是從社區尋找模塊?基礎框架用的YUI3,大部分二次開發的底層模塊,還有和業務緊密結合的UI模塊都是自己寫的。當然也會用社區寫的模塊,比如上傳組件、highcharts、Ace等。如果說怎麼選擇模塊的話,那就是具體情況具體分析了,總體原則有兩個:能不自己寫,就不自己寫;選擇最符合需求的,一般來說,要麼選最好的,要麼選最快出結果的。
2. 模塊化後的前端怎麼部署django nginx
以vue框架為例,在nginx.conf中監聽80或443埠的server的路由配置設置為:
location ^~ /api { # url如/api/v1.0/user/info等,通過uwsgi轉發到django後端項目中處理
include /etc/nginx/uwsgi_params;
uwsgi_pass 127.0.0.1:8077;
include /etc/nginx/mime.types;
}
location ^~ /static { # 後端的資源文件夾為static,前端請求後端項目包內的靜態文件
root /root/backend_end_project/static/;
}
location ^~ /admin { # django的後台管理頁面通過uwsgi轉交給django處理
include /etc/nginx/uwsgi_params;
uwsgi_pass 127.0.0.1:8077;
include /etc/nginx/mime.types;
}
location ^~ /assets { # 前端的資源文件夾為assets,前端請求前端項目包內的靜態文件
root /root/front_end_project/dist;
}
location / { # 表示其它路徑都交給前端項目根目錄下的index.html處理
root /root/front_end_project;
try_files $uri /index.html;
}
3. 如何把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知道自己有多少應用要部署,將會進行相應的部署動作。部署完後,就可以在瀏覽器訪問了。
4. 一個前端頁面如何部署
一個前端頁面,在本地直接打開就能訪問。另外如果是要放到伺服器下的話,可以裝個nginx,或者apache,或者tomcat,直接放到網頁路徑下,就行。
5. 前後端分離的前端是怎麼部署到生產環境中的,直接通過 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范)
6. 前端通過gulp編譯後的文件,怎麼部署到伺服器
伺服器上寫部署腳本,從代碼庫里拉項目代碼,跑gulp自動化。或者打包傳給後端讓他搞。
7. 前端如何部署nginx跨域
跨域基本上都是要後端來配合的,
打比方說,我提供的server,只是供我自己域名下web應用來請求的,如果對方在自己的web應用裡面調用我提供的api,給用戶提供了很好的體驗,但是負荷扔給了我的伺服器,這是不合理的
所以,跨域很難通過前端來配置
那麼就要說解決辦法了
①如果另一面也是自己的伺服器,那麼在自己的伺服器配置即可
②如果是他人的伺服器,那麼可以自己在自己的伺服器上做一個轉發,轉發出去的請求會以你自己伺服器的ip署名,如果對方不同意這個做法,也可以屏蔽掉你,合情合理
8. 如何用Tomcat部署前端靜態文件
幾種方法: 1、在myeclipse里部署 這個直接在myeclipse里配置好tomcat的根路徑。 在server里可以看到tomcat,選擇部署你的工程就行了。 2、把自己的web工程放在tomcat的webapps下
9. 前端怎麼把網頁部署到tomcat 怎麼啟動tomcat
首先配置下Myeclipse里Tomcat服務 在Windows-->Preferences-->MyEclipse-->Application Servers 中選擇你的tomcat版本,在右側的面板里指定tomcat的安裝路徑後,點擊Apply或OK保存
10. 常見的前端集成部署方案有哪些各自的優缺點是什麼
前端行業經歷了這么長時間的發展,技術元素非常豐富,這里列舉出一般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項技術元素都直接或間接的對前端開發工具設計產生一定的影響,因此能否串聯其他技術要素,使得前端開發形成一個連貫可持續優化的開發體系,工具的設計至關重要。