Skip to content

Commit

Permalink
chore: switch production domain config except image bed
Browse files Browse the repository at this point in the history
  • Loading branch information
sxlwar committed Nov 29, 2020
1 parent 5ca6b0a commit cf80d50
Show file tree
Hide file tree
Showing 5 changed files with 26 additions and 57 deletions.
39 changes: 4 additions & 35 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,21 +1,15 @@
# Ratel

这个项目是[Angular完全开发手册](http://www.hijavascript.com) 的官网代码
This project includes the code of official site of [Angular完全开发手册](https://blog.chtoma.com)

This project includes the code of official site of [Angular完全开发手册](http://www.hijavascript.com)
## Development server

运行 `ng serve` 启动开发服务器,然后在浏览器中输入 `http://localhost:4200`

run `ng serve` to start the server, then type `http://localhost:4200` in your browser.
## Build

运行 `npm run build:ssr` 会启动项目的构建过程,运行完成将会在 dist 目录下生成以下结构:
## Build

run `npm run build:ssr` to start the building process of the project. After that, the following structure will be generated in the `dist` folder.

> 注意: 由于 ng-zorro-antd 目前不支持ssr,在打包服务端渲染代码时需要将 src/formly-zorro/formly-zorro-routing.module.ts 中的子路由注释掉
> Note: Currently ng-zorro-antd does not support ssr, you need to comment the sub routing config in src/formly-zorro/formly-zorro-routing.module.ts before production build.
```js
Expand All @@ -24,61 +18,36 @@ run `npm run build:ssr` to start the building process of the project. After that
----server|
```

browser文件夹下为打包后的源代码。server文件夹下为服务端渲染所需要的代码。

The packed source code will be in the `browser` folder, and the code for server side rendering will be in the `server` folder.

----

## NGX_FORMLY_ZORRO

### 产生原因
### Cause

Ngx Formly 是一个可以使用动态JSON驱动的表单库,如果你需要更加详细的学习它的使用方法,请访问[官方仓库](https://github.com/ngx-formly/ngx-formly)

Ngx Formly is a dynamic JSON powered form library, if you want to learn more details about how to use it, please visit [ngx-formly](https://github.com/ngx-formly/ngx-formly)

Ng Zorro Antd 是 Ant Design 的 Angular 版本,如果你需要更加详细的学习它的使用方法,请访问[官方仓库](https://github.com/NG-ZORRO/ng-zorro-antd)

Ng Zorro Antd is the Angular version of Ant Design, if you want to learn more details about it, please visit [NG-ZORRO](https://github.com/NG-ZORRO/ng-zorro-antd)

目前 Ngx Formly 官方尚未提供对 Ng Zorro Antd 的支持,尽管已经有开发者向官方仓库提交了相关的 pr,但目前为止都没有合入,可能管理人员的工作太忙吧。

Ngx Formly offcially does not provide support for Ng Zorro Antd till now. Even some developers have submitted relative pull requests, but are still not merged, maybe the admins are far too busy due to the 996 :)

> 源码位置:src/app/ngx-formly-zorro 完全按照 [Ngx Formly](https://github.com/ngx-formly/ngx-formly) 的方式开发
> Source code position:src/app/ngx-formly-zorro, totally followed the way of [Ngx Formly](https://github.com/ngx-formly/ngx-formly) to develop
### 安装方法

### Installation

按照[Ngx Formly](https://github.com/ngx-formly/ngx-formly)官方提供的方式进行即可,只不过Ng Zorro Antd 的包尚未在 **@ngx-formly/** 路径下,目前你可以使用 ngx-formly-zorro 这个包来替代,例如:

Just follow the method provided by [Ngx Formly](https://github.com/ngx-formly/ngx-formly), but the package of Ng Zorro Antd is still not under the path **@ngx-formly/**, you can use package ngx-formly-zorro to substitute, for instance:

```bash
npm install --save @angular/forms @ngx-formly/core ngx-formly-zorro
```

### DEMO

DEMO的方式也是安全按照 [Ngx Formly](https://github.com/ngx-formly/ngx-formly)的方式进行,由于没来得及申请域名,暂时将它放在这个博客网站下。

Demo also totally follows the [Ngx Formly](https://github.com/ngx-formly/ngx-formly), because we still have not applied for domain name, we put it in the blog site.

你可以跳转到 [这里](http://www.hijavascript.com) 查看相关示例及代码,并且你也可以通过每个demo右上方的按钮进行调试或者查看示例代码。

You can click [here](http://www.hijavascript.com) to check the examples and codes, besides you can also click the buttons above every demo to debug or check the code.
You can click [here](http://blog.chtoma.com) to check the examples and codes, besides you can also click the buttons above every demo to debug or check the code.

### CONTRIBUTING

目前只是封装了 Ng Zorro Antd 中常用的几个基础表单控件,你可以使用 Ng Formly 提供的自定义控件方式继续添加其它表单控件。在提交代码前强烈建议您阅读 [Ngx Formly](https://github.com/ngx-formly/ngx-formly) 封装UI的方式,并按照其扩展UI组件的方式继续实现其它表单控件。

Currently only a few basic form controls commonly used in Ng Zorro Antd are packaged, you can continue to add other form controls using the custom controls provided by Ng Formly. Before you submit your code, we strongly recommend you to read the method to encapsulate the UI from [Ngx Formly](https://github.com/ngx-formly/ngx-formly), and continue to implement other form controls in the same way that they extend UI components.

### CONTRIBUTORS

[<img src="https://avatars2.githubusercontent.com/u/20088392?s=60&v=4" width="100">](https://github.com/sxlwar)[<img src="https://avatars1.githubusercontent.com/u/26297704?s=60&v=4" width="100">](https://github.com/ZQ-jhon)[<img src="https://avatars3.githubusercontent.com/u/30424884?s=60&v=4" width="100">](https://github.com/Lei-Wei)
[<img src="https://avatars2.githubusercontent.com/u/20088392?s=60&v=4" width="40" style="margin-right: 1em">](https://github.com/sxlwar)[<img src="https://avatars1.githubusercontent.com/u/26297704?s=60&v=4" width="40" style="margin-right: 1em">](https://github.com/ZQ-jhon)[<img src="https://avatars3.githubusercontent.com/u/30424884?s=60&v=4" width="40">](https://github.com/Lei-Wei)
20 changes: 10 additions & 10 deletions src/app/article/article-creation/article-creation.component.ts
Original file line number Diff line number Diff line change
@@ -1,21 +1,21 @@
import { Component, OnDestroy, OnInit, ViewChild, Inject, PLATFORM_ID } from '@angular/core';
import { animate, state, style, transition, trigger } from '@angular/animations';
import { isPlatformBrowser } from '@angular/common';
import { Component, Inject, OnDestroy, OnInit, PLATFORM_ID, ViewChild } from '@angular/core';
import { AbstractControl, FormBuilder, FormGroup, Validators } from '@angular/forms';
import { ActivatedRoute } from '@angular/router';

import { BehaviorSubject, of, Observable, iif } from 'rxjs';
import { filter, takeWhile, tap, take, share, map, switchMap, distinctUntilChanged } from 'rxjs/operators';
import { ImageCroppedEvent } from 'ngx-image-cropper';
import { BehaviorSubject, iif, Observable, of } from 'rxjs';
import { distinctUntilChanged, filter, map, share, switchMap, take, takeWhile, tap } from 'rxjs/operators';
import { Article } from 'src/app/interface/response.interface';

import { UploadResult, UploadService } from 'src/app/providers/upload.service';
import { User } from '../../auth/interface/auth.interface';
import { EditorComponent } from '../../codemirror/editor/editor.component';
import { ArticleCategory } from '../../constant/constant';
import { DeactivateGuard } from '../../interface/app.interface';
import { AuthService } from '../../providers/auth.service';
import { ArticleService } from '../providers/article.service';
import { ImageCroppedEvent } from 'ngx-image-cropper';
import { UploadService, UploadResult } from 'src/app/providers/upload.service';
import { isPlatformBrowser } from '@angular/common';
import { trigger, transition, animate, state, style } from '@angular/animations';



@Component({
selector: 'ratel-article-creation',
Expand Down Expand Up @@ -193,7 +193,7 @@ export class ArticleCreationComponent implements OnInit, OnDestroy {

private getContent(): string {
return !!this.isOriginalCtrl.value
? this.editor.data + '\n\r' + '转载请注明出处:www.hijavascript.com'
? this.editor.data + '\n\r' + '转载请注明出处:blog.chtoma.com'
: this.editor.data;
}

Expand Down
2 changes: 1 addition & 1 deletion src/app/article/article/article.component.html
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ <h4>{{data.subtitle}}</h4>
<li [hidden]="!data.updatedAt">更新时间:{{data.updatedAt}}</li>
<li [hidden]="!data.isOriginal">
<ratel-tag content="原创"></ratel-tag>
转载请注明出处:www.hijavascript.com
转载请注明出处:blog.chtoma.com
</li>
<li *ngIf="(user | async)?.id === data.userId">
<button mat-raised-button [routerLink]="['/create', {id: data.id}]" color="primary">更新</button>
Expand Down
18 changes: 9 additions & 9 deletions src/app/providers/upload.service.ts
Original file line number Diff line number Diff line change
@@ -1,15 +1,15 @@
import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { MatSnackBar } from '@angular/material/snack-bar';

import * as qiniu from 'qiniu-js';
import { from, Observable, of, Subject } from 'rxjs';
import { catchError, delay, filter, map, mergeMap, take, takeUntil, timeout, switchMapTo } from 'rxjs/operators';

import { catchError, delay, filter, map, mergeMap, switchMapTo, take, takeUntil, timeout } from 'rxjs/operators';
import { ALLOW_UPLOAD_FILE_TYPES, CRUDVar, QiniuErrorCode } from '../constant/constant';
import { GetQiniuTokenResponse } from '../interface/response.interface';
import { BaseService } from './base.service';



export interface UploadResult {
name: string;
url: string;
Expand All @@ -20,7 +20,7 @@ export interface UploadResult {
}

@Injectable({
providedIn: 'root'
providedIn: 'root',
})
export class UploadService extends BaseService {
private readonly path = 'upload';
Expand All @@ -33,7 +33,7 @@ export class UploadService extends BaseService {

private uploadResults: UploadResult[] = [];

readonly urlPrefix = 'https://assets.hijavascript.com/';
readonly urlPrefix = 'https://assets.hijavascript.com/'; // FIXME: replace it after domain filing

result$: Subject<UploadResult[]> = new Subject();

Expand All @@ -49,10 +49,10 @@ export class UploadService extends BaseService {

/**
* Upload file to qiniu server;
* 1、获取token
* 2、上传图片
* 3、图片全部上传完成时发出上传结果
* 4、发生错误或完成时终止数据流
* 1、request token
* 2、upload image
* 3、emit upload result after finished
* 4、terminate data flow as error occurs or finished
*/
uploadImage(files: FileList): Observable<UploadResult[]> {
this.uploading$.next(true);
Expand Down
4 changes: 2 additions & 2 deletions src/environments/environment.prod.ts
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
export const environment = {
production: true,
name: 'prod',
apiAddress: 'https://www.hijavascript.com',
githubAuthRedirectAddress: 'https://www.hijavascript.com',
apiAddress: 'https://blog.chtoma.com',
githubAuthRedirectAddress: 'https://blog.chtoma.com',
};

0 comments on commit cf80d50

Please sign in to comment.