前言

當前，AngularJS作為Javascript的MVC（也有人說是MV*，暫且不糾結(jié)這個）框架被廣泛使用，它為更快且更容易地開發(fā)響應(yīng)式的Web提供了強大的機制。作為MVC框架，它將Web前端代碼分成三個組件Model，View和Controller。因此，在data model,應(yīng)用邏輯（Controllers）和view展示之間有明確的分離，讓你更容易地關(guān)注關(guān)鍵的開發(fā)區(qū)域。view接收來自model的數(shù)據(jù)來展示。當用戶通過點擊或者敲擊鍵盤和應(yīng)用交互時，controller通過改變模型中的數(shù)據(jù)進行響應(yīng)。最終，view得到了發(fā)生在model中的變化這個通知，從而它能更新展示的內(nèi)容。

最近我在給一個不懂計算機的朋友做一個小的應(yīng)用程序，我想用Angular來做。一般我們在IDE上開發(fā)的時候都會用npm start或者ng serve來啟動一個內(nèi)部服務(wù)器，可是如果我把開發(fā)好的程序給朋友，怎么才能讓他能夠在自己的瀏覽器中打開呢？我這里選擇了nginx服務(wù)器來部署我的程序。

一、新建Angular程序

1.安裝nodejs

2.安裝淘寶鏡像

npm install -g cnpm --registry=https://registry.npm.taobao.org

3.安裝angular cli

npm install -g @angular/cli

4.新建項目

ng new myProj

5.安裝依賴包

在有package.json的目錄下cnpm install

6.IDE中運行

ng serve 或 npm install， 在localhost:4200中查看

二、打包

ng build,會在項目文件夾下生成dist文件，里面是打包后的文件。

三、部署

在nginx官網(wǎng)中下載nginx

把dist文件夾下的打包文件拷貝到nginx/html下并重命名為myProj

修改conf/nginx.conf文件
location / {
   root html/myProj;
   index index.html index.htm;
  }

點擊nginx.exe啟動nginx

在瀏覽器中輸入localhost:80即可看到項目

這個時候，我們只需要把nginx打包發(fā)給朋友，然后告訴他點擊nginx.exe后，在瀏覽器中輸入localhost:80即可。

總結(jié)

以上就是這篇文章的全部內(nèi)容了，希望本文的內(nèi)容對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，如果有疑問大家可以留言交流，謝謝大家對腳本之家的支持。

最新評論