# ng学习通讯录

**Repository Path**: wike2019/ng_one

## Basic Information

- **Project Name**: ng学习通讯录
- **Description**: angluar入门案例
- **Primary Language**: JavaScript
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2020-07-01
- **Last Updated**: 2020-12-19

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# Angular通讯录简易版

这个项目主要让大家了解angluar的入门使用，代码有注释

## 包括 5个界面

1. 列表页面 https://wikecloud.com/ng_one/list
2. 收藏页面 https://wikecloud.com/ng_one/collection    
3. 详情页面 https://wikecloud.com/ng_one/list/4
4. 编辑页面 https://wikecloud.com/ng_one/edit/4
5. 添加页面 https://wikecloud.com/ng_one/edit

## 线上预览地址 https://wikecloud.com/ng_one/

## 开发版部署

1. git clone https://gitee.com/wike2019/ng_one.git
2. npm install
3. npm start

## 生成环境部署

需要先搭建docker环境

1. npm install
2. ng build --prod --base-href '/ng_one/'
3. docker-compose up -d

就可以访问 http://127.0.0.1:3080/ng_one

正式环境中可以使用nginx反代

proxy_pass  http://127.0.0.1:3080;

## 注意
可以根据你的需要修改目录需要修改3处地方
1. angular.json

    "outputPath": "dist/ng_one",

2. 编译路径的 base-href

    ng build --prod --base-href '/你自己设置的路径/'

3. default.conf


        location ^~/ng_one 你自己的路径/{
        
            root   /usr/share/nginx/html;
            
            try_files $uri $uri/ /ng_one 你自己的路径/index.html;
         }