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 相关文章推荐
如何实现JS函数的重载
Sep 22 Javascript
jquery 操作表格实现代码(多种操作打包)
Mar 20 Javascript
JavaScript插件化开发教程 (一)
Jan 27 Javascript
PHPMyAdmin导入时提示文件大小超出PHP限制的解决方法
Mar 30 Javascript
js流动式效果显示当前系统时间
May 16 Javascript
js字符串引用的两种方式(必看)
Sep 18 Javascript
详解用webpack把我们的业务模块分开打包的方法
Jul 20 Javascript
微信小程序获取微信运动步数的实例代码
Jul 20 Javascript
浅谈webpack打包之后的文件过大的解决方法
Mar 07 Javascript
vue基于viewer实现的图片查看器功能
Apr 12 Javascript
jQuery Datatables 动态列+跨列合并实现代码
Jan 30 jQuery
详解Vue3.0 + TypeScript + Vite初体验
Feb 22 Vue.js
利用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
mysql 字段类型说明
2007/04/27 PHP
PHP实现的简单网络硬盘
2015/07/29 PHP
利用ajax和PHP实现简单的流程管理
2017/03/23 PHP
PHP封装的PDO数据库操作类实例
2017/06/21 PHP
解决laravel查询构造器中的别名问题
2019/10/17 PHP
固定背景实现的背景滚动特效示例分享
2013/05/19 Javascript
js实现在字符串中提取数字
2013/11/05 Javascript
JavaScript中判断整字类型最简洁的实现方法
2014/11/08 Javascript
jQuery实现时尚漂亮的弹出式对话框实例
2015/08/07 Javascript
jQuery简单自定义图片轮播插件及用法示例
2016/11/21 Javascript
React 高阶组件入门介绍
2018/01/11 Javascript
React Native 真机断点调试+跨域资源加载出错问题的解决方法
2018/01/18 Javascript
vue权限管理系统的实现代码
2019/01/17 Javascript
VUE单页面切换动画代码(全网最好的切换效果)
2019/10/31 Javascript
javascript实现贪吃蛇游戏(娱乐版)
2020/08/17 Javascript
js面试题之异步问题的深入理解
2020/09/20 Javascript
如何通过JS实现日历简单算法
2020/10/14 Javascript
[01:12:40]DOTA2-DPC中国联赛 正赛 DLG vs XG BO3 第三场 1月25日
2021/03/11 DOTA
python 除法保留两位小数点的方法
2018/07/16 Python
Python实现投影法分割图像示例(一)
2020/01/17 Python
python实现串口通信的示例代码
2020/02/10 Python
如何提高python 中for循环的效率
2020/04/15 Python
利用python控制Autocad:pyautocad方式
2020/06/01 Python
Python爬虫爬取博客实现可视化过程解析
2020/06/29 Python
python3.5的包存放的具体路径
2020/08/16 Python
理解Django 中Call Stack机制的小Demo
2020/09/01 Python
requests在python中发送请求的实例讲解
2021/02/17 Python
HTML5中使用json对象的实例代码
2018/09/10 HTML / CSS
布鲁明戴尔百货店:Bloomingdale’s
2016/12/21 全球购物
全球领先美式家具品牌:Ashley爱室丽家居
2017/08/07 全球购物
提高EJB性能都有哪些技巧
2012/03/25 面试题
大学生求职推荐信
2013/11/27 职场文书
2014社区三八妇女节活动总结
2014/03/01 职场文书
计算机求职信
2014/07/02 职场文书
离婚协议书范本(通用篇)
2014/11/30 职场文书
独生子女证明范本
2015/06/19 职场文书