Preparing pages and routes for customizations

Complete this task to set up pages and routes for development mode for any customizations that are made - either by differential customization or customization by overrides. A local point-in-time copy of assets (JSON files) is brought into the package so that all changes are localized to the page and so that no further product updates to assets ever affect the page being customized.

Before you begin

Ensure that you understand important folders and files in Order Hub. This topic includes the Order Hub code directory and the folder and file structure for the different modules.

Procedure

Create an assets folder under <order_hub_code_directory>/<module-name>/packages/<route-name>/src-custom.

For example: <order_hub_code_directory>/buc-app-order/packages/order-search-result/src-custom/assets.
Copy over the assets from the <order_hub_code_directory>/<module-name>/packages/<module_short_name>-shared folder to the assets folder that you created.

For example, order-shared:
Open the <order_hub_code_directory>/<module-name>/angular.json file.

For example: <order_hub_code_directory>/buc-app-order/angular.json.

Replace the current contents of the projects > <route-name> > architect > build > configurations > merged > assets array to direct the module to use the customized assets files instead of the files from /order-shared.

For example: Update projects > order-search-result > architect > build > configurations > merged > assets with the following entries:

                {
                  "glob": "**",
                  "input": "packages/order-search-result/src-merged/assets",
                  "output": "assets"
                },  
                {
                  "glob": "*.json",
                  "input": "packages/order-search-result/src-merged/assets/buc-app-order",
                  "output": "assets/order-search-result"
                },
                {
                  "glob": "**",
                  "input": "node_modules/@buc/svc-angular/assets",
                  "output": "assets"
                },
                {
                  "glob": "**",
                  "input": "node_modules/@buc/common-components/assets",
                  "output": "assets"
                }

Also replace the contents in the projects > <route-name> > architect > build > configurations > merged-prod > assets array.
Copy the environments folder from <module-name>/packages/<route-name>/src into <module-name>/packages/<route-name>/src-custom.

For example: Copy the environments folder from buc-app-order/packages/order-search-result/src into buc-app-order/packages/order-search-result/src-custom.
Go to the <module-name>/packages/<route-name>/src-custom/environments directory.

For example: buc-app-order/packages/order-search-result/src-custom/environments
Add the following line to the end of both the environment.ts and envrionment.prod.ts files.
```
environment.customization = true;
```
Stop and restart the server so that changes to the angular.json and overrides.json files take effect.
Stop the job in the terminal. Then run:
```
yarn stop-app
```
```
yarn start-app
```