angular2+node.js express打包部署的實(shí)戰(zhàn)
Angular2我自己還在摸索學(xué)習(xí)中,本文介紹了angular2+node.js express打包部署的實(shí)戰(zhàn),分享給大家,也給自己留個(gè)筆記
angular是客戶端js,Node.js 是服務(wù)端JS,建立SPA 網(wǎng)站需要把這兩者統(tǒng)一到一起。
1、angular2項(xiàng)目創(chuàng)建,使用angular-cli
ng new mypos
2、使用express命令行工具創(chuàng)建express項(xiàng)目。
express --view=hbs
3、angular2 中 需要引用到第三方庫 例如 jQuery,bootstrape,
index.html中需要添加應(yīng)用,然后文件需要拷貝到assets目錄
<linkrel="stylesheet"type="text/css"href="/assets/primeng/resources/themes/bootstrap/theme.css" rel="external nofollow" /> <linkrel="stylesheet"type="text/css"href="/assets/primeng/resources/primeng.min.css" rel="external nofollow" /> <linkrel="stylesheet"type="text/css"href="/assets/primeng/resources/font-awesome.min.css" rel="external nofollow" /> <scriptsrc="/assets/jquery.min.js"></script> <linktype="text/css"href="/assets/bootstrap/css/bootstrap.min.css" rel="external nofollow" rel="stylesheet"> <scriptsrc="/assets/bootstrap/js/bootstrap.min.js"></script>
4、修改angular-cli.json //指定為express的靜態(tài)文件目錄。
"outDir":"express/public/"
5、打包
ng build --prod
6、進(jìn)入express運(yùn)行目錄
npm start
以上就是本文的全部內(nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
angularJS自定義directive之帶參方法傳遞詳解
今天小編就為大家分享一篇angularJS自定義directive之帶參方法傳遞詳解,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2018-10-10
Angular directive遞歸實(shí)現(xiàn)目錄樹結(jié)構(gòu)代碼實(shí)例
本篇文章主要介紹了Angular directive遞歸實(shí)現(xiàn)目錄樹結(jié)構(gòu)代碼實(shí)例,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-05-05
Angular中$state.go頁面跳轉(zhuǎn)并傳遞參數(shù)的方法
這篇文章主要介紹了angular中$state.go頁面跳轉(zhuǎn)并傳遞參數(shù)的方法,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友可以參考下2017-05-05
AngularJS實(shí)現(xiàn)與后臺(tái)服務(wù)器進(jìn)行交互的示例講解
今天小編就為大家分享一篇AngularJS實(shí)現(xiàn)與后臺(tái)服務(wù)器進(jìn)行交互的示例講解,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2018-08-08
詳解在Angular項(xiàng)目中添加插件ng-bootstrap
這篇文章主要介紹了詳解在 Angular 項(xiàng)目中添加插件 ng-bootstrap,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-07-07
關(guān)于angular引入ng-zorro的問題淺析
這篇文章主要給大家介紹了關(guān)于angular引入ng-zorro的問題,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-09-09
Angular的FormArray和模態(tài)框結(jié)合使用實(shí)例詳解
這篇文章主要為大家介紹了Angular的FormArray和模態(tài)框結(jié)合使用實(shí)例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2022-11-11

