Configuración de now y deploy

Configuración de now y deploy 2021

Aqui el mío: https://platzi-music-blush.vercel.app/
UPDATE

• Ahora ya no se llama now es vercel.
• Lo que hice me funciono a mi, espero a ustedes también:

• instalar vercel con npm en global

npm install -g vercel

• loguearnos con el comando vercel login
• Hacer el deploy con el comando vercel:
  1.- En Set up and deploy “~/projects/platzi-music”? [Y/n] => Pulsar Y
  2.- En Which scope do you want to deploy to?: Pulsar Enter
  3.- En Link to existing project? [y/N]: Pulsar N y enter:
  4.- En What’s your project’s name? (platzi-music): Presionar Enter
  5.- En In which directory is your code located?: Presionar Enter
  6.- En Want to override the settings? [y/N]: Pulsar Y
  7.- Con espacio seleccionar Build command y Development Command y al terminar de seleccionar: Enter
  8.- En What's your Build Command?, poner: `

vue-cli-service build

9.- En What's your Development Command?, poner:

vue-cli-service serve

Y Enter
Pd: Se copiara automáticamente el link de su proyecto así que al finalizar el deploy solo deben pegarlo en el navegador.

El proceso aqui, se me presento un poco enredado, depronto pudo ser por lo viejo el video, con now ahora llamado vercel, es muy sencillo ahora, como entrar a la pagina, importar el repositorio y esperar que el solo haga todo. no se si es debido, pero quiero compartir este video para lo que quieran ver lo sencillo que puede ser tutorial rapido

**Tuve el siguiente error: **

2020-01-13T14:05:36.690Z  Downloading 48 deployment files...
2020-01-13T14:05:37.539Z  Installing build runtime...
2020-01-13T14:05:37.541Z  yarn info @now/build-utils@latest...
2020-01-13T14:05:37.545Z  yarn info @now/static-build...
2020-01-13T14:05:38.049Z  Build runtime installed: 510.018ms
2020-01-13T14:05:38.492Z  Looking up build cache...
2020-01-13T14:05:38.978Z  Running builder.exports.build...
2020-01-13T14:05:38.983Z  Installing dependencies...
2020-01-13T14:05:51.256Z
2020-01-13T14:05:51.257Z  > node-sass@4.13.0 install /zeit/6b93ac14/node_modules/node-sass
2020-01-13T14:05:51.257Z  > node scripts/install.js
2020-01-13T14:05:51.257Z
2020-01-13T14:05:51.526Z  Downloading binary from https://github.com/sass/node-sass/releases/download/v4.13.0/linux-x64-72_binding.node
2020-01-13T14:05:52.620Z  Download complete
2020-01-13T14:05:52.623Z  Binary saved to /zeit/6b93ac14/node_modules/node-sass/vendor/linux-x64-72/binding.node
2020-01-13T14:05:52.661Z  Caching binary to /zeit/.npm/node-sass/4.13.0/linux-x64-72_binding.node
2020-01-13T14:05:52.742Z
2020-01-13T14:05:52.743Z  > core-js@2.6.10 postinstall /zeit/6b93ac14/node_modules/core-js
2020-01-13T14:05:52.743Z  > node postinstall || echo "ignore"
2020-01-13T14:05:52.743Z
2020-01-13T14:05:52.793Z  Thank you for using core-js ( https://github.com/zloirock/core-js ) for polyfilling JavaScript standard library!
2020-01-13T14:05:52.793Z  
2020-01-13T14:05:52.793Z  The project needs your help! Please consider supporting of core-js on Open Collective or Patreon: 
2020-01-13T14:05:52.793Z  > https://opencollective.com/core-js 
2020-01-13T14:05:52.793Z  > https://www.patreon.com/zloirock 
2020-01-13T14:05:52.793Z
2020-01-13T14:05:52.793Z  Also, the author of core-js ( https://github.com/zloirock ) is looking for a good job -)
2020-01-13T14:05:52.793Z
2020-01-13T14:05:52.957Z
2020-01-13T14:05:52.957Z  > uglifyjs-webpack-plugin@0.4.6 postinstall /zeit/6b93ac14/node_modules/uglifyjs-webpack-plugin
2020-01-13T14:05:52.957Z  > node lib/post_install.js
2020-01-13T14:05:52.957Z
2020-01-13T14:05:53.021Z
2020-01-13T14:05:53.021Z  > node-sass@4.13.0 postinstall /zeit/6b93ac14/node_modules/node-sass
2020-01-13T14:05:53.021Z  > node scripts/build.js
2020-01-13T14:05:53.021Z
2020-01-13T14:05:53.168Z  Binary found at /zeit/6b93ac14/node_modules/node-sass/vendor/linux-x64-72/binding.node
2020-01-13T14:05:53.169Z  Testing binary
2020-01-13T14:05:53.266Z  Binary is fine
2020-01-13T14:05:53.903Z  npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.9 (node_modules/fsevents):
2020-01-13T14:05:53.903Z  npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.9: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
2020-01-13T14:05:53.903Z
2020-01-13T14:05:53.906Z  added 1103 packages from 699 contributors in 14.592s
2020-01-13T14:05:53.961Z  Running "npm run build"
2020-01-13T14:05:54.141Z
2020-01-13T14:05:54.141Z  > platzi-music@1.0.0 build /zeit/6b93ac14
2020-01-13T14:05:54.141Z  > cross-env NODE_ENV=production webpack --progress --hide-modules
2020-01-13T14:05:54.141Z
2020-01-13T14:06:01.302Z  Hash: 558b8a5f22283042f5a5
2020-01-13T14:06:01.302Z  Version: webpack 3.12.0
2020-01-13T14:06:01.303Z  Time: 6810ms
2020-01-13T14:06:01.303Z         Asset     Size  Chunks                    Chunk Names
2020-01-13T14:06:01.303Z      build.js   369 kB       0  [emitted]  [big]  main
2020-01-13T14:06:01.303Z  build.js.map  1.77 MB       0  [emitted]         main
2020-01-13T14:06:01.335Z   11% building modules 10/15 modules 5 active ...ode_modules/timers-bowserify/main.js
2020-01-13T14:06:01.335Z  More details: https://zeit.co/docs/v2/platform/frequently-asked-questions#missing-public-directory
2020-01-13T14:06:01.335Z      at validateDistDir (/zeit/faaf3da4146fa99a/.build-utils/.builder/node_modules/@now/static-build/dist/index.js:132:15)
2020-01-13T14:06:01.335Z      at Object.build (/zeit/faaf3da4146fa99a/.build-utils/.builder/node_modules/@now/static-build/dist/index.js:374:13)
2020-01-13T14:06:01.335Z      at <anonymous>
2020-01-13T14:06:01.335Z      at process._tickDomainCallback (internal/process/next_tick.js:228:7)
2020-01-13T14:06:01.450Z  worker exited with code 20 and signal null
2020-01-13T14:06:03.848Z  done```

• npm start
• npm test
• npm run dev
• npm run build

Esto también se puede hacer a través de Netlify no?

En la nueva versión de vue genera un index html, peo he tratado de usar ese index para correrlo en “producción” (En realidad lo corro en la máquina local para ver si funciona pero no funciona) Así que no se cómo podría hostear esto en un VPS

genial esto de now.

Excelente curso

Fácil y rápido.

Hola, mi build funciona correctamente, lo abrí en un editor de texto y tengo lo siguiente:

!function(t){function e(n){if(r[n])return r[n].exports;var a=r[n]={i:n,l:!1,exports:{}};return t[n].call(a.exports,a,a.exports,e),a.l=!0,a.exports}var r={};e.m=t,e.c=r,e.d=function(t,r,n){e.o(t,r)||Object.defineProperty(t,r,{configurable:!1,enumerable:!0,get:n})},e.n=function(t){var r=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(r,"a",r),r},e.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},e.p="dist/",e(e.s=48)}([function(t,e,r){"use strict";function n(t){r(213)}var a=r(47),i=r(1),s=n,o=i(a.a,null,!1,s,null,null);e.a=o.exports},function(t,e){t.exports=functi...

que es lo correcto, pero cuando subo todo el dist a un servidor para poder verlo en produccion, el inspector de chrome me dice que mi archivo build,js en realidad tiene lo siguiente:

/******/ (function(modules) { // webpackBootstrap
/******/ 	function hotDisposeChunk(chunkId) {
/******/ 		delete installedChunks[chunkId];
/******/ 	}
/******/ 	var parentHotUpdateCallback = window["webpackHotUpdate"];
/******/ 	window["webpackHotUpdate"] = 
/******/ 	function webpackHotUpdateCallback(chunkId, moreModules) { // eslint-disable-line no-unused-vars
/******/ 		hotAddUpdateChunk(chunkId, moreModules);
/******/ 		if(parentHotUpdateCallback) parentHotUpdateCallback(chunkId, moreModules);
/******/ 	} ;
/******/ 	
/******/ 	function hotDownloadUpdateChunk(chunkId) { // eslint-disable-line no-unused-vars
/******/ 		var head = document.getElementsByTagName("head")[0];
/******/ 		var script = document.createElement("script");
/******/ 		script.type = "text/javascript";
/******/ 		script.charset = "utf-8";
/******/ 		script.src = __webpack_require__.p + "" + chunkId + "." + hotCurrentHash + ".hot-update.js";
/******/ 		;
/******/ 		head.appendChild(script);
/******/ 	}
/******/ 	...

No pego el código completo porque es demasiaaaado extenso, pero pego las primeras lineas al menos, notese que hay una gran diferencia, que puedo estar haciendo mal, espero sus comentarios, muchas gracias 😄

Que fácil es usar Now

estoy por comenzar un proyecto y tengo 3 ambientes, dev, stg y prod, mi duda es la siguiente, para el ambiente de dev, tengo que hacer un build como se hace a prod?

muy facil el deploy con now.

En mi caso me salió un problema:

Error: No output directory named “public” found.

Tuve que cambiar el webpack.config.json y reemplazar ‘dist’ por ‘public’ y luego agregar a esa carpeta el index.html cambiando también el atributo src del script

y bueno …
https://cmb-music.fyupanquia.now.sh/

Seria bueno una clase bonus de como subir tu proyecto a Github pages 🤔

Buenas noches para realizar el deploy en produccion en un servidor VPS como seria ? yo tengo un servidor AWS pero no se que pasos seguir para configurar la aplicacion con ngnix ? Gracias de antemano.