Vue Cli WebPack

Para el desarrollo más fácil es recomendable usar algún tipo de template de vue que nos entregue una estructura básica para que nosotros podamos trabajar y no comenzar todo desde cero.

#vue init webpack 
?Project name nombre_proyecto
?Project description descripción del proyecto
?Author nosotros mismos
?Vue build standalone 
?Install vue.router? yes (para trabajar con rutas)
?Use ESLint to lint your code? Yes (permite encontrar errores)
?Pick an ESLint present Standart
?Setup unit tests with Karma + Mocha? Yes (para realizar pruebas unitarias)
?Setup e2e tests with Nightwatch? Yes (para realizar pruebas de flujo)

Puerto

De partida con los comando que mostraba el articulo anterior ya podemos ejecutar nuestro proyecto, este es ejecutado en el puerto 8080, por eso si nosotros ya estamos ocupando aquel puerto tenemos que cambiar la configuración de nuestro proyecto y elegir otro puerto que este libre de uso.

Lo que trae

npm run dev: Desarrollo de la clase.

• Webpack + vue-loader para los componentes Vue individuales.
• Estado de conservación de hot-reload
• Estado que preserva la superposición de error de compilación
• Lint-on-save con ESLint
• Mapas de origen

• _npm run build: _Producción construida lista.

• JavaScript minificado con UglifyJS .

• HTML minifiecado con html-minificado .

• CSS a través de todos los componentes extraídos en un solo archivo y minificado con cssnano .
• Todos los activos estáticos compilados con los hashes de versiones para un almacenamiento en caché eficiente a largo plazo, y una producción index.html se genera automáticamente con URL apropiadas para estos activos generados.
• Utilice npm run build --report para construir con análisis de tamaño de paquete.

_npm run unit: _Las pruebas se ejecutan en PhantomJS con Karma + Mocha + karma-webpack.

• Soporta ES2015 + en los archivos de prueba.
• Soporta todos los cargadores webpack.
• Fácil inyección simulada.

_npm run e2e: _Pruebas de extremo a extremo con Nightwatch.

• Ejecute pruebas en varios navegadores en paralelo.

• Funciona con un comando fuera de la caja:

  • Las dependencias de selenio y cromeditro se manejan automáticamente.
  • Desembra automáticamente el servidor Selenium.