More Premium Hugo Themes Premium Vue Themes

Vue Boilerplate Template

Efficient development of web SPA using Vue.js(2.*) + Webpack + Element-ui + Pwa + Vuex + Vuex-router + Vue-i18n + Dayjs + Lodash.

Vue Boilerplate Template

Efficient development of web SPA using Vue.js(2.*) + Webpack + Element-ui + Pwa + Vuex + Vuex-router + Vue-i18n + Dayjs + Lodash.

Author Avatar Theme by nicejade
Github Stars Github Stars: 467
Last Commit Last Commit: Oct 10, 2020 -
First Commit Created: Apr 29, 2023 -
Vue Boilerplate Template screenshot

Overview

The awesome-vue-cli3-example is an open-source Vue boilerplate based on vue-cli3. It aims to provide a reference for building medium-sized Vue projects. The boilerplate includes various optimizations and commonly used libraries such as vue-i18n, axios, and lodash. It also offers articles and tutorials on Vue and Webpack optimization.

Features

  • Optimized build process using vue-cli
  • Includes commonly used libraries such as vue-i18n, axios, lodash, etc.
  • Regularly updated with new features and improvements
  • Webpack optimization tutorials and tips
  • Integration with Webpack plugins like webpack-jarvis and webpack-bundle-analyzer
  • Templates and helper functions for handling requests

Installation

  1. Install Node.js (version >=4.x, 8.x preferred), Npm version 4+ (Yarn preferred), and Git.
  2. Clone the repository: git clone [repository-url].
  3. Install dependencies: npm install or yarn install.
  4. Run the build process: node build.js.
  5. Start the local server: node server.js.
  6. Access the demo page at http://localhost:8080/.

Additional commands:

  • To specify a different port, use PORT environment variable or the command node build.js --port [desired-port].
  • To optimize libraries with webpack, run webpack --config build/webpack.dll.conf.js.
  • For webpack-jarvis, open localhost:1337 in the browser.
  • For webpack-bundle-analyzer, open http://localhost:8888/.
  • For executing requests, refer to the example in the helper/ajax.js file.

Summary

The awesome-vue-cli3-example is a Vue boilerplate that aims to facilitate the development of medium-sized Vue projects. It offers optimized builds, commonly used libraries, and various webpack optimization techniques. The boilerplate also provides articles and tutorials to help developers get started with Vue development.