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 相关文章推荐
jQuery DOM操作小结与实例
Jan 07 Javascript
分享一个asp.net pager分页控件
Jan 04 Javascript
Jquery实现列表(隔行换色,全选,鼠标滑过当前行)效果实例
Jun 09 Javascript
Jquery动态进行图片缩略的原理及实现
Aug 13 Javascript
JavaScript插件化开发教程 (三)
Jan 27 Javascript
javascript 继承学习心得总结
Mar 17 Javascript
基于BootStrap Metronic开发框架经验小结【五】Bootstrap File Input文件上传插件的用法详解
May 12 Javascript
jquery表单插件Autotab使用方法详解
Jun 24 Javascript
详解使用React全家桶搭建一个后台管理系统
Nov 04 Javascript
vue-cli3.0配置及使用注意事项详解
Sep 05 Javascript
JQuery判断radio单选框是否选中并获取值的方法
Jan 17 jQuery
vue自定义正在加载动画的例子
Nov 14 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中http_build_query 的一个问题
2012/03/25 PHP
PHP判断IP并转跳到相应城市分站的方法
2015/03/25 PHP
php自动给网址加上链接的方法
2015/06/02 PHP
php图片水印添加、压缩、剪切的封装类实现
2020/04/18 PHP
PHP中的多种加密技术及代码示例解析
2016/10/20 PHP
PHP echo()函数讲解
2019/02/15 PHP
laravel实现一个上传图片的接口,并建立软链接,访问图片的方法
2019/10/12 PHP
CL vs ForZe BO5 第四场 2.13
2021/03/10 DOTA
使用jQuery实现更改默认alert框体
2015/04/13 Javascript
jQuery实现折叠、展开的菜单组效果代码
2015/09/16 Javascript
JS截取与分割字符串常用技巧总结
2015/11/10 Javascript
Bootstrap嵌入jqGrid,使你的table牛逼起来
2016/05/05 Javascript
Web Uploader文件上传插件使用详解
2016/05/10 Javascript
js的各种排序算法实现(总结)
2016/07/23 Javascript
vue-cli实现多页面多路由的示例代码
2018/01/30 Javascript
element-ui 实现响应式导航栏的示例代码
2020/05/08 Javascript
[02:10]探秘浦东源深体育馆 DOTA2 Supermajor不见不散
2018/05/17 DOTA
Python迭代用法实例教程
2014/09/08 Python
使用python验证代理ip是否可用的实现方法
2018/07/25 Python
对Python信号处理模块signal详解
2019/01/09 Python
Python使用APScheduler实现定时任务过程解析
2019/09/11 Python
使用批处理脚本自动生成并上传NuGet包(操作方法)
2019/11/19 Python
Python实现遗传算法(二进制编码)求函数最优值方式
2020/02/11 Python
Python中pyecharts安装及安装失败的解决方法
2020/02/18 Python
如何写python的配置文件
2020/06/07 Python
Python Flask异步发送邮件实现方法解析
2020/08/01 Python
python实现移动木板小游戏
2020/10/09 Python
HTML5通过navigator.mediaDevices.getUserMedia调用手机摄像头问题
2020/04/27 HTML / CSS
销售所有的狗狗产品:Dog.com
2016/10/13 全球购物
世界上最大的艺术和工艺用品商店:MisterArt.com
2018/07/13 全球购物
.NET面试题:什么是值类型和引用类型
2016/01/12 面试题
信息专业毕业生五年职业规划参考
2014/02/06 职场文书
2014年教师党员公开承诺书
2014/05/28 职场文书
文明单位创建材料
2014/12/24 职场文书
创业计划书之蛋糕店
2019/08/29 职场文书
Ruby处理CSV数据方法详解
2022/04/18 Ruby