The installation

Install vue-CLI latest version

cnpm install -g @vue/cli
// Global installation on MAC requires sudo before the command
sudo cnpm install -g @vue/cli
Copy the code

Check the VUE-CLI version

vue -V
Copy the code

Create a project

  • Switch to a blank folder you created and use the following command
Vue create Project name// The project name cannot contain capital letters or Chinese characters
Copy the code
  • Select a Creation mode
    • Default created (Default ([Vue 2] Babel, esLint))
    • Default created (Default (Vue 3 Preview) ([Vue 3] Babel, esLint))
    • Manually (Manually)
    • Historical configurations saved by yourself
  • Configuration (space key is select and cancel, A key is select all, blue is recommended)
    • Choose Vue version: Select the Vue version
    • Babel: Support for Babel (Es6 syntax is common in Vue projects, but sometimes our projects need to be compatible with older browsers, so we need to introduce Babel plug-in to convert Es6 to ES5)
    • Router: Vue-router is supported
    • Vuex: Supports Vuex
    • CSS pre-processors: CSS pre-processors are supported
    • Linter/Formatter: Supports code style checking and formatting
    • TypeScript: Supports source writing in TypeScript
    • Progressive Web App (PWA) Support: PWA Support
    • Unit Testing: Support for Unit Testing
    • E2E Testing: End-to-end (support E2E Testing)
  • Save the configuration Yes or No
  • Select Vue Version Choose Vue version
    • 2. X (for the production version, 2.x is recommended)
    • 3.x (Preview)
  • ** Select routing mode Use history mode for router? (Requires proper server setup for index fallback in production) (Y/n) **
    • History (Y) : Internet Explorer supports only 10+
    • Hash (N)
  • CSS preprocessing mode
    • **Sass/SCSS (with dart-sass) **
    • Sass/SCSS (with node-sass)
    • Less
    • Stylus 
  • Automated code formatting detection (blue is recommended)
    • ESLint with error prevention only
    • ESLint + Airbnb config
    • ESLint + Standard config
    • ESLint + Prettier
  • Syntax checking (I recommend turning es-Lint off)
    • Lint on Save
    • Lint and fix on commit (requires Git) (fix and commit)
  • Configuration file location (Babel, ESLint, etc.)
    • In dedicated config files
    • In package.json
  • Whether to save as default Yes or No
    • YES (Save preset as Save position: Name **)
    • NO