总纲

此项目分前端与后台两部分 前端为ag-cli 后端为lowdb

cd backend
npm install
node app

在localhost：5000 查看json

cd frontend
npm install 
ng serve

在localhost:4200 查看项目

backend

注意事项

• 需要用最新的lowdb 新版与旧版的语法完全不同 而且会报错
• 需要掌握json-server lowdb lodash语法

frontend

创建命令

ng new frontend
cd frontend
ng serve

安装ngx-bootstrap

# version 3.x
npm install ngx-bootstrap bootstrap --save

# .angular-cli.json 就这一行 记得重启服务器生效
"styles": [
  "../node_modules/bootstrap/dist/css/bootstrap.min.css","styles.css"
],#开始测试

# src/app/app.module.ts
import { AlertModule } from 'ngx-bootstrap';
...

@NgModule({
   ...
   imports: [AlertModule.forRoot(),... ],... 
})

# app.component.html
<alert type="success">hello</alert>

注意：更改.angular-cli.json后 需要重启 ng serve

目录结构规划

ag的模块划分 基本有两种构想
一种是一个页面算一个模块 页面内再划分组件 因为就是一级结构 所以路由十分简单 其他公共组件调取share文件夹
另一种是以功能块为一个模块 如 将文章列表 文章详情 和他们的module service 放到一起 好处是路由清晰 封装后适合一个人开发一整块 不好的地方在于层层嵌套
我将采用第一种模块方式 理由是结构清晰 路由简约 功能单一

此项目的文件夹规则为：
各个子导航 以页面为单位 各占一个文件夹 每个页面有自己的share文件夹 里面是自有component和route
share文件夹 下属 pipe component config models services layout
user单独一个文件夹
auth一个文件夹

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!