Preparar entorno para el deploy
Instalar URL Rewrite:
Agregar Nuevo Sitio Web
Aparecerá la siguiente pantalla:
- Coloca el nombre del sitio
- La ruta donde se almacenarán los archivos de la publicación del proyecto
- Y por último, el puerto. Y "Aceptar"
Agregar Aplicación
Saldrá la siguiente pantalla
- Colocas el Alias
- La ruta de acceso al directorio donde irán los archivos de la publicación del proyecto.
- Por último, "Aceptar"
Deberás ver tu sitio y tu aplicación:
Si ya se realizó la instalación del URL Rewrite. Deberá verse la opción dentro del Administrador IIS:
Ahora el entorno está listo.
Preparar el proyecto Angular y hacer el Deploy a IIS
Dentro del directorio src debe crear un archivo web.config
Que resolverá las rutas de la APP.
web.config
<configuration>
<system.webServer>
<rewrite>
<rules>
<clear /> <!-- Imperative Step, otherwise IIS will throw err -->
<rule name="Angular Routes" stopProcessing="true">
<match url=".*" />
<conditions logicalGrouping="MatchAll">
<add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
<add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
</conditions>
<action type="Rewrite" url="/" />
</rule>
</rules>
</rewrite>
</system.webServer>
</configuration>
imagen de referencia
Ese mismo archivo, deberá ir en el build de la app. Por lo que hay que indicarlo. Esto se hace dentro del archivo angular.json
dentro del arreglo de assets:[]
"assets": [
"src/favicon.ico",
"src/assets",
"src/web.config"
]
Generar build de la aplicación
En este caso, se hace un build para usar en el entorno de producción. Pero también puede ser para desarrollo.
Muy importante indicar la subcarpeta donde éste estará alojado con el flag --base-href
. También hay que destacar que debe colocarse el nombre de la aplicación que está dentro del sitio que se creó al inicio. En la sección de preparación del entorno para el deploy. En este caso, la app se le llamó "NuevoProyecto"
producción
ng build --configuration=production --base-href "/NuevoProyecto/"
Al ejecutar el comando genera la carpeta dist
y dentro otro directorio con el nombre del proyecto. Y dentro el publish que irá en el directorio que se creó al preparar el entorno en IIS.
Copiar los archivos que están en el dist
y guardar en /nuevo-sitio
📂 C:
├─ 📂 inetpub
├─ 📂 wwwroot
├─ 📂 nuevo-sitio
En IIS levantar el servicio del sitio:
Después de eso, abrir la app.
Imagen de portada, de tommy pixel en Pixabay
Top comments (2)
https://platzi.com/tutoriales/1670-angular-8/11626-subir-aplicacion-en-angular-a-iis/#:~:text=Generar%20build%20de%20la%20aplicaci%C3%B3n&text=Al%20ejecutar%20el%20comando%20genera,preparar%20el%20entorno%20en%20IIS.&text=Despu%C3%A9s%20de%20eso%2C%20abrir%20la%20app.
notion.so/danielmeza/Subir-Proyect...