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 相关文章推荐
永不消失的title提示代码
Feb 15 Javascript
JS分割字符串并放入数组的函数
Jul 04 Javascript
jquery.boxy弹出框(后隔N秒后自动隐藏/自动跳转)
Jan 15 Javascript
jQuery回调函数的定义及用法实例
Dec 23 Javascript
JavaScript基本数据类型及值类型和引用类型
Aug 25 Javascript
JavaScript操作class和style样式代码详解
Feb 13 Javascript
再谈Javascript中的异步以及如何异步
Aug 19 Javascript
jquery实现图片列表鼠标移入微动
Dec 01 Javascript
详谈js中数组(array)和对象(object)的区别
Feb 27 Javascript
JavaScript实现设置默认日期范围为最近40天的方法分析
Jul 12 Javascript
p5.js入门教程之图片加载
Mar 20 Javascript
vue-router中的hash和history两种模式的区别
Jul 17 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的FTP学习(四)
2006/10/09 PHP
PHP跨时区(UTC时间)应用解决方案
2013/01/11 PHP
thinkphp数据查询和遍历数组实例
2014/11/28 PHP
Zend Framework教程之Zend_Registry对象用法分析
2016/03/22 PHP
php性能分析之php-fpm慢执行日志slow log用法浅析
2016/10/17 PHP
window.showModalDialog使用手册
2007/01/11 Javascript
用javascript实现分割提取页面所需内容
2007/05/09 Javascript
ASP Json Parser修正版
2009/12/06 Javascript
基于JavaScript实现继承机制之原型链(prototype chaining)的详解
2013/05/07 Javascript
JS实现的简单鼠标跟随DiV层效果完整实例
2015/10/31 Javascript
jquery实现倒计时功能
2015/12/28 Javascript
javascript实现页面滚屏效果
2017/01/17 Javascript
vue通过watch对input做字数限定的方法
2017/07/13 Javascript
详解Vue调用手机相机和相册以及上传
2019/05/05 Javascript
Vue 3.0 前瞻Vue Function API新特性体验
2019/08/12 Javascript
基于Web Audio API实现音频可视化效果
2020/06/12 Javascript
vue+elementUI实现简单日历功能
2020/09/24 Javascript
原生JavaScript实现轮播图
2021/01/10 Javascript
Python针对给定列表中元素进行翻转操作的方法分析
2018/04/27 Python
python xlsxwriter创建excel图表的方法
2018/06/11 Python
python多线程抽象编程模型详解
2019/03/20 Python
python3的url编码和解码,自定义gbk、utf-8的例子
2019/08/22 Python
tensorflow使用range_input_producer多线程读取数据实例
2020/01/20 Python
浅谈keras使用预训练模型vgg16分类,损失和准确度不变
2020/07/02 Python
Python实现迪杰斯特拉算法过程解析
2020/09/18 Python
在vscode中启动conda虚拟环境的思路详解
2020/12/25 Python
HTML5 Canvas鼠标与键盘事件demo示例
2013/07/04 HTML / CSS
《美丽的小兴安岭》教学反思
2014/02/26 职场文书
有创意的广告词
2014/03/18 职场文书
青年文明号服务承诺
2014/03/31 职场文书
旅行社优秀创业计划书
2014/08/16 职场文书
2014年党员自我评议(5篇)
2014/09/12 职场文书
行政文员实习自我鉴定范文
2014/09/14 职场文书
《刷子李》教学反思
2016/02/20 职场文书
Python爬虫之爬取哔哩哔哩热门视频排行榜
2021/04/28 Python
Python编写nmap扫描工具
2021/07/21 Python