angular2+node.js express打包部署的实战


Posted in Javascript onJuly 27, 2017

Angular2我自己还在摸索学习中,本文介绍了angular2+node.js express打包部署的实战,分享给大家,也给自己留个笔记

angular是客户端js,Node.js 是服务端JS,建立SPA 网站需要把这两者统一到一起。

1、angular2项目创建,使用angular-cli

ng new mypos

2、使用express命令行工具创建express项目。

express --view=hbs

3、angular2 中 需要引用到第三方库 例如 jQuery,bootstrape,

index.html中需要添加应用,然后文件需要拷贝到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的静态文件目录。

"outDir":"express/public/"

5、打包

ng build --prod

6、进入express运行目录

npm start

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
获取dom元素那些讨厌的位置封装代码
Jun 23 Javascript
jquery对表单操作2
Apr 06 Javascript
动态创建样式表在各浏览器中的差异测试代码
Sep 13 Javascript
JQuery查找DOM节点的方法
Jun 11 Javascript
详解微信小程序 相对定位和绝对定位
May 11 Javascript
微信小程序 新建登录页并实现tabBar隐藏
Jun 13 Javascript
使用vuex缓存数据并优化自己的vuex-cache
May 30 Javascript
微信小程序实现同一页面取值的方法分析
Apr 30 Javascript
对TypeScript库进行单元测试的方法
Jul 18 Javascript
vue实现购物车小案例
Sep 27 Javascript
微信小程序 textarea 层级过高问题简单解决方案
Oct 14 Javascript
JS实现拖动模糊框特效
Aug 25 Javascript
利用Ionic2 + angular4实现一个地区选择组件
Jul 27 #Javascript
vue单页应用中如何使用jquery的方法示例
Jul 27 #jQuery
详解win7 cmd执行vue不是内部命令的解决方法
Jul 27 #Javascript
Vue2.0如何发布项目实战
Jul 27 #Javascript
在Vue中如何使用Cookie操作实例
Jul 27 #Javascript
vue 怎么创建组件及组件使用方法
Jul 27 #Javascript
详解Angular-cli生成组件修改css成less或sass的实例
Jul 27 #Javascript
You might like
解析php addslashes()与addclashes()函数的区别和比较
2013/06/24 PHP
php截取字符串之截取utf8或gbk编码的中英文字符串示例
2014/03/12 PHP
PHP中读取文件的8种方法和代码实例
2014/08/05 PHP
PHP基于堆栈实现的高级计算器功能示例
2017/09/15 PHP
PHP定义字符串的四种方式详解
2018/02/06 PHP
PHP实现Huffman编码/解码的示例代码
2018/04/20 PHP
php中curl和soap方式请求服务超时问题的解决
2018/06/11 PHP
php解析非标准json、非规范json的方式实例
2020/12/10 PHP
PNG背景在不同浏览器下的应用
2009/06/22 Javascript
JSQL 批量图片切换的实现代码
2010/05/05 Javascript
jQuery Pagination Ajax分页插件(分页切换时无刷新与延迟)中文翻译版
2013/01/11 Javascript
file模式访问网页时iframe高度自适应解决方案
2013/01/16 Javascript
Jquery 表单验证类介绍与实例
2013/06/09 Javascript
javascript复制粘贴与clipboardData的使用
2014/10/16 Javascript
使用nodejs开发cli项目实例
2015/06/03 NodeJs
基于javascript如何传递特殊字符
2015/11/30 Javascript
Javascript复制实例详解
2016/01/28 Javascript
详解如何实现一个简单的 vuex
2018/02/10 Javascript
Webpack devServer中的 proxy 实现跨域的解决
2018/06/15 Javascript
详解javascript appendChild()的完整功能
2018/08/18 Javascript
详解ES6 系列之异步处理实战
2018/10/26 Javascript
Vue实现一个图片懒加载插件
2019/03/11 Javascript
element实现合并单元格通用方法
2019/11/13 Javascript
Vue axios获取token临时令牌封装案例
2020/09/11 Javascript
[07:31]DOTA2卡尔工作室 英雄介绍主宰篇
2013/06/25 DOTA
[02:53]DOTA2英雄昆卡基础教程
2013/11/25 DOTA
Python中的日期时间处理详解
2016/11/17 Python
基于Python共轭梯度法与最速下降法之间的对比
2020/04/02 Python
CSS3的transition和animation的用法实例介绍
2014/08/20 HTML / CSS
2014年内勤工作总结
2014/11/24 职场文书
银行先进个人总结
2015/02/15 职场文书
事业单位聘任报告
2015/03/02 职场文书
业务员岗位职责范本
2015/04/03 职场文书
小学教师党员承诺书
2015/04/27 职场文书
分享:关于学习的励志名言赏析
2019/08/16 职场文书
公文写作:工伤事故分析报告怎么写?
2019/11/05 职场文书