控制台
实名认证
中国站
登录
-
张绪东 浪潮云资深架构师 -
霍林 浪潮云产品经理 -
马毅 浪潮云资深技术专家 -
张伟 资深架构师 -
高传集 云计算产品首席架构师 -
贾德星 云计算产品高级架构师 -
梁圣奇 云计算产品高级架构师
【技术实践】iot前台开发环境：搭建 SpringBoot+angularJs2
一、安装软件 1、安装nodejs 和 angularjs/cli https://nodejs. org/en/ 安装 nodejs 安装 angularjs/cli： npm install -g @angular/cli 执行 npm instal
一、安装软件
1、安装nodejs 和 angularjs/cli
https://nodejs.org/en/
安装 nodejs
安装 angularjs/cli： npm install -g @angular/cli
执行 npm install
执行 ng build，编译前台代码输出到 spring boot 资源目录
2、安装augury
在google网上应用商店添加插件augury ，用来调试前端代码
3、新建普通的 angular 项目 - ng new hello
通过命令 ng new hello 生成一个新项目以及应用的骨架代码
通过命令 ng server 启动项目，默认端口4200。
二、Spring boot 和 angular 集成
Spring boot 需要修改的地方在angular-cli.json中：
1、在springboot项目中新建/复制 angular 项目
方法一： 在src 目录下通过命令添加angular项目 ： ng new angular
方法二： 将之前创建好的项目copy进来
设置angular项目的输出目录为springboot的资源目录
修改angular-cli.json 配置文件的name 和 outDir
该项目下name为 iot_hub
outDir 为../resources/static(静态资源路径，系统可以直接访问且路径下的所有文件均可被直接读取)
编译angular项目，产生输出到springboot资源目录
npm install
ng server --proxy-conf proxy.conf
ng build
2、启动工程
1、启动Spring boot
2、启动前端angular工程调试：npm start
3、访问服务
http://localhost:8080
http://localhost:4200
三、附录 - 常见问题
1、解决跨域问题
加一个这样的文件
同时修改package.json中的start
2、热部署调试工程
buildscript {
ext {
springBootVersion = '1.5.9.RELEASE'
}
repositories {
maven {
url "http://repo.iop.inspur.com:8081/nexus/content/groups/public"
}
}
dependencies {
classpath("org.springframework.boot:spring-boot-gradle-plugin:${springBootVersion}")
}
}
apply plugin: 'java'
apply plugin: 'idea'
apply plugin: 'eclipse'
apply plugin: 'org.springframework.boot'
group = 'com.inspur.iot'
version = '0.0.1-SNAPSHOT'
sourceCompatibility = 1.8
repositories {
maven {
url "http://repo.iop.inspur.com:8081/nexus/content/groups/public"
}
}
bootRun {
addResources = true
}
configurations.all {
exclude module: 'google-collections'
}
dependencies {
compile('org.springframework.boot:spring-boot-starter')
compile('org.springframework.boot:spring-boot-starter-web')
compile('io.springfox:springfox-swagger2:2.6.1')
compile('io.springfox:springfox-swagger-ui:2.6.1')
compile('org.springframework.boot:spring-boot-starter-jdbc')
compile('org.springframework.boot:spring-boot-starter-data-jpa')
compile('mysql:mysql-connector-java:5.1.21')
compile('org.springframework.boot:spring-boot-starter-data-redis')
// compile("org.springframework:spring-orm")
compile("org.springframework.boot:spring-boot-devtools")
compile ("org.springframework.boot:spring-boot-maven-plugin:1.5.9.RELEASE")
testCompile('org.springframework.boot:spring-boot-starter-test')
}
作者：梁圣奇
专业领域：微服务架构
专家简介：近二十年软件开发与架构设计经验，深入了解多种软件设计模式，在微服务架构治理、物联网服务平台设计研发等领域拥有丰富实战经验，同时专注技术分享，帮助开发者成长。
