Saltar al contenido

Cómo implementar una aplicación de vue a GitHub pagesNov, 17thIn este tutorial, vamos a aprender acerca de la implementación de una aplicación vue.js …

marzo 13, 2020

 

En este tutorial, vamos a aprender acerca de la implementación de una aplicación vue.js a páginas de GitHub.

Estamos desplegando nuestra aplicación vue en cuatro pasos.

Paso 1

Empuje su aplicación vue.js a un repositorio GitHub.

Paso 2

Crear un nuevo archivo llamado vue.config.js en su carpeta de aplicación de la raíz.

Ahora añade a continuación un código de archivo vue.config.js reemplazando con su propio publicPath.

module.exports = {
publicPath: '/vue-app-deploy-example/'}

Nota: publicPath es el nombre del repositorio GitHub se crea en el momento de empujar su aplicación a GitHub.

Paso 3

Ahora estamos creando un archivo de script de despliegue que nos ayuda a implementar nuestra aplicación para páginas de GitHub.

crear un nuevo archivo llamado deploy.sh de tu carpeta de aplicación de la raíz y añadir el siguiente código al reemplazar su nombre de usuario GitHub y el nombre del repositorio.

#!/usr/bin/env sh

# abort on errors
set -e

# build
npm run build

# navigate into the build output directory
cd dist

git init
git add -A
git commit -m 'deploy'

git push -f [email protected]:/.git master:gh-pages
cd -

Paso 4: Ejecutar script deploy

Abrir el terminal y ejecutar a continuación comando para implementar correctamente su aplicación para páginas GitHub

bash deploy.sh

Una vez completado con éxito todos los pasos anteriores ahora abre la aplicación de vue GitHub repo y haga clic en Configuración pestaña y luego desplazarse por las páginas de GitHub para ver su URL de aplicaciones en vivo.