From bf299d8234d624e900f00a107a210c0859302b5e Mon Sep 17 00:00:00 2001
From: Cory LaViska <cory@abeautifulsite.net>
Date: Fri, 20 Oct 2023 09:04:15 -0400
Subject: [PATCH] backport PR 1670

---
 docs/pages/frameworks/angular.md | 28 ++++++++++++++++++++++++++--
 1 file changed, 26 insertions(+), 2 deletions(-)

diff --git a/docs/pages/frameworks/angular.md b/docs/pages/frameworks/angular.md
index c785b5766..160c2e39b 100644
--- a/docs/pages/frameworks/angular.md
+++ b/docs/pages/frameworks/angular.md
@@ -10,16 +10,40 @@ Angular [plays nice](https://custom-elements-everywhere.com/#angular) with custo
 
 ## Installation
 
+### Download the npm package
+
 To add Web Awesome to your Angular app, install the package from npm.
 
 ```bash
 npm install @shoelace-style/shoelace
 ```
 
-Next, [include a theme](/getting-started/themes) and set the [base path](/getting-started/installation#setting-the-base-path) for icons and other assets. In this example, we'll import the light theme and use the CDN as a base path.
+### Update the Angular Configuration
+
+Next, [include a theme](/getting-started/themes). In this example, we'll import the light theme.
+Its also important to load the components, by using a <script> tag into the index.html file. However, the Angular way to do it is by adding a script configurations into your angular.json file as follows:
+
+```
+"architect": {
+  "build": {
+    ...
+    "options": {
+      ...
+      "styles": [
+        "src/styles.scss",
+        "@shoelace-style/shoelace/dist/themes/light.css"
+       ],
+      "scripts": [
+        "@shoelace-style/shoelace/dist/shoelace.js"
+      ]
+      ...
+```
+
+### Setting up the base path
+
+Next, set the [base path](/getting-started/installation#setting-the-base-path) for icons and other assets in the `main.ts`. In this example, we'll use the CDN as a base path.
 
 ```jsx
-import '@shoelace-style/shoelace/%NPMDIR%/themes/default.css';
 import { setBasePath } from '@shoelace-style/shoelace/%NPMDIR%/utilities/base-path';
 
 setBasePath('https://cdn.jsdelivr.net/npm/@shoelace-style/shoelace@%VERSION%/%CDNDIR%/');