mirror of
https://github.com/angular/angular
synced 2026-05-24 09:28:37 +00:00
82cc576e6f
Use pnpm instead of yarn as the package manager and interaction tool for the repo PR Close #62924
19 lines
1.1 KiB
Markdown
19 lines
1.1 KiB
Markdown
# Installing Angular DevTools in Safari (experimental)
|
|
|
|
### Requirements
|
|
|
|
- Xcode 13+
|
|
|
|
To install Angular DevTools in Safari follow the steps:
|
|
|
|
* Open Safari and make sure the checkbox in `Safari -> Preferences -> Advanced -> Show develop menu in menu bar` is checked.
|
|
|
|
* Make sure the flag in `Develop -> Experimental Features -> Web Inspector Extensions` is checked.
|
|
|
|
* Build Angular DevTools with a chrome configuration with `pnpm devtools:build:chrome` this will create an Angular DevTools build in `dist/bin/devtools/projects/shell-browser/src/prodapp`.
|
|
|
|
* Run `xcrun safari-web-extension-converter --macos-only dist/bin/devtools/projects/shell-browser/src/prodapp`. This will convert Angular DevTools into a Safari web extension. This command should open Xcode when it completes.
|
|
|
|
* In Xcode, click the build button and wait for the extension to build. Once this is complete, a system prompt should ask you to open Safari and enable the extension. You'll know the extension is enabled because of an Angular icon present in browser toolbar.
|
|
|
|
* Open any Angular application in dev mode and open Safari DevTools, you should see the Angular Tab there.
|