Skip to content

Commit

Permalink
docs: updated language (#779)
Browse files Browse the repository at this point in the history
- changed wording for better understanding

- updated instructions for location strategies
  • Loading branch information
siaarzh authored Mar 27, 2020
1 parent 9ef391f commit a17fac9
Showing 1 changed file with 16 additions and 16 deletions.
32 changes: 16 additions & 16 deletions docs/deploy.en-US.md
Original file line number Diff line number Diff line change
Expand Up @@ -28,9 +28,9 @@ Avoid executing `ng build` when throw error **JavaScript heap out of memory**:
}
```

### Environmental variable
### Environmental variables

When you need to distinguish between development and deployment and test environment, you can configure the corresponding parameters according to different environments through the `src/environments` folder. The configuration items can also be called directly in the application. At the same time, you need to configure the configuration items in `angular.json`. Finally, you can change the environment configuration through commands.
When you need to distinguish between development and deployment, and test environments, you can configure the corresponding parameters according to different environments through the `src/environments` folder. The configuration items can also be called directly in the application. At the same time, you need to configure the configuration items in `angular.json`. Finally, you can change the environment configuration through commands.

### Analyze the build file volume

Expand Down Expand Up @@ -60,29 +60,29 @@ Package with the following command:
ng build --prod --sourcemaps
```

Then use [source-map-explorer](https://github.com/danvk/source-map-explorer/blob/master/README.md) to help you explore the JavaScript package after the production environment is built to analyze each module. The size of the volume.
Then use [source-map-explorer](https://github.com/danvk/source-map-explorer/blob/master/README.md) to help you explore the JavaScript package after the production environment is built to analyze each module by their volume size.

## Release

For the release, you only need to publish the static file that is finally generated, that is, the static file of the `dist` folder to your cdn or static server. Note that the `index.html` is usually It will be the entry page for your background service. You may need to change the import path of the page after determining the static of js and css.
When you are ready to deploy (release) your the app, you need only to publish the generated build artifacts - that is, the files in the `dist` folder - to your cdn or static server. Note that the `index.html` is usually the entry page for your app and handles all missing file requests. You may need to change the import path of the page after determining the static of js and css.

The default static resource reference path directly points to the directory where the `dist` folder is published. For example, if you post `dist` to the root directory of the `ng-alain.com` site, the requested URL is `//ng. -alain.com/***.js`, `//ng-alain.com/***.css`, if `dist` is posted to a directory under a certain directory such as `v2`, request The URL is `//ng-alain.com/v2/***.js`, `//ng-alain.com/v2/***.css`.
The default static resource reference path directly points to the directory where the `dist` folder is published. For example, if you post `dist` to the root directory of the `ng-alain.com` site, the requested URL is `//ng-alain.com/***.js`, `//ng-alain.com/***.css`, if `dist` is posted to a directory under a certain directory, such as `v2`, request The URL is `//ng-alain.com/v2/***.js`, `//ng-alain.com/v2/***.css`.

If your static resource is deployed to another domain name (such as a separate cdn address), you can specify a cdn address with the `-d` parameter.
If your static resource is deployed to another domain name (such as a separate CDN address), you can specify a CDN address with the `--deployUrl` parameter.

```bash
ng build --prod -d=//cdn.ng-alain.com/
ng build --prod -deployUrl=//cdn.ng-alain.com/
```

The generated `index.html` inside `*.js`, `*.css` will automatically add `//cdn.ng-alain.com/*.js`.
The generated `index.html` with its `*.js`, `*.css` files will automatically refer to `//cdn.ng-alain.com/*.js`, `//cdn.ng-alain.com/*css`, respectively.

### Routing strategy

Angular front-end routing has two different strategies `HashLocationStrategy` and `PathLocationStrategy`. The former is routed by the path after `#`, and the front-end routing management is performed by [HTML5 History](//developer.mozilla.org/en-US/docs/Web/API/History_API), while the latter is similar. The access path does not have `#`. Through the configuration of the server, the specified URL can be accessed to the current page, enabling front-end routing management.
Angular front-end routing has two different strategies: `HashLocationStrategy` and `PathLocationStrategy`. The former is routed by appending a `#` before a path, and the front-end routing management is performed by [HTML5 History](//developer.mozilla.org/en-US/docs/Web/API/History_API), while the latter is similar, but the path does not have `#` appended before it. Through the configuration of the server, the specified URL can be accessed to the current page, enabling front-end routing management.

If you want to use the `PathLocationStrategy` policy, you need to replace `RouterModule.forRoot(routes, { useHash: true })` of `./src/app/routes/routes.module.ts` with `RouterModule.forRoot(routes )`. At the same time, the server needs to do a mapping, such as:
If you want to use `PathLocationStrategy`, you need to replace `RouterModule.forRoot(routes, { useHash: true })` of `./src/app/routes/routes-routing.module.ts` with `RouterModule.forRoot(routes)`, since that is the default Angular behavior. You might notice that this can also be done by changing the `useHash` variable in the `src/environments/environment.*.ts` files, depending on your project configulation. Importantly, your server needs to be correctly configured, such that is returns the `index.html` for any 404 errors:

express example of:
Express server example:

```js
app.use(express.static(path.join(__dirname, 'build')));
Expand All @@ -92,7 +92,7 @@ app.get('/*', function (req, res) {
});
```

Example of egg:
Egg server example:

```js
// controller
Expand All @@ -114,15 +114,15 @@ For more questions about Angular routing, please read [official website](//angul

NG-ALAIN provides a complete image file for building Angular projects based on the nginx WEB service. Where nginx is a mirror using [nginx:1.13.5-alpine](https://github.com/nginxinc/docker-nginx/blob/master/mainline/alpine/Dockerfile), which basically satisfies NG-ALAIN The project's good operating environment, if there are more needs, you can easily specify *nginx.conf* with `docker run`.

#### 1, Build the image
#### 1. Building the image

Build a complete image of the runtime environment required by NG-ALAIN based on the Dockerfile.

```bash
docker build -t ng-alain .
```

#### 2, Running
#### 2. Running

**Based on compose (Recommended)**

Expand All @@ -138,9 +138,9 @@ The details can be modified with `docker-compose.yml`.
docker run -d -p 80:80 --name alain ng-alain
```

Finally you can visit:http://localhost/
Finally, you can visit:http://localhost/

#### 3, About SSL
#### 3. About SSL

The Dockerfile provided by NG-ALAIN is relatively simple, and the most common use of real projects is support for SSL.

Expand Down

0 comments on commit a17fac9

Please sign in to comment.