From a17fac901febd809863d1a7bc38b5e3a8c88cb84 Mon Sep 17 00:00:00 2001 From: Serzhan Akhmetov <34094388+siaarzh@users.noreply.github.com> Date: Fri, 27 Mar 2020 06:33:53 +0600 Subject: [PATCH] docs: updated language (#779) - changed wording for better understanding - updated instructions for location strategies --- docs/deploy.en-US.md | 32 ++++++++++++++++---------------- 1 file changed, 16 insertions(+), 16 deletions(-) diff --git a/docs/deploy.en-US.md b/docs/deploy.en-US.md index 5df118772..233cf878f 100644 --- a/docs/deploy.en-US.md +++ b/docs/deploy.en-US.md @@ -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 @@ -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'))); @@ -92,7 +92,7 @@ app.get('/*', function (req, res) { }); ``` -Example of egg: +Egg server example: ```js // controller @@ -114,7 +114,7 @@ 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. @@ -122,7 +122,7 @@ Build a complete image of the runtime environment required by NG-ALAIN based on docker build -t ng-alain . ``` -#### 2, Running +#### 2. Running **Based on compose (Recommended)** @@ -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.