Install and use vue-cli webpack in a node environment, and use vue-cliwebpack

Source: Internet
Author: User

Install and use vue-cli webpack in a node environment, and use vue-cliwebpack

Step 1: download and install node. js and Its npm components;

Step 2: Use node-v; npm-v to test the node. check whether js and npm have been installed successfully (it is recommended that you use the GIT command line tool because GIT is a linux system). if the version is displayed, it indicates that it has been installed successfully, as shown in;

  

Step 3: Download vue-cli, enter npm install-g vue-cli in the command line, and automatically download vue-cli (a lot of dependent files will be generated), for example;

  

Step 4: Enter vue in the command line to test whether the vue has been successfully installed, as shown in figure;

  

Step 5: Use the command line vue list to check which sub-classes of vue, such;

  

Step 6: Use the vue init webpack *** command line to download the webpack. (*** indicates the project name in English, such as sanfeng1;

  

You will be asked during installation, ①, Project name (sanfeng1), and Project name (sanfeng1 ). (Are you sure you want to press enter or N)

② Project description (A Vue. js project); Project description (A vue. js project ). (Enter a brief introduction in English)

③ Author (sunsanfeng); Author (sunsanfeng ). (Are you sure you want to press enter or N)

④ Vue build (Use arrow keys)> Runtime + Compiler: recommended for most usersRuntime-only: about 6KB lighter min + gzip, but templates (or any Vue-specificHTML) are ONLY allowed in. vue files-render functions are required elsewhere;Vue creation (using the arrow keys)> runtime + Compiler: most users recommend the Run Time: About 6 kb lightweight + gzip, but the template (or any Vue specificHTML) only. The VUE file rendering function is required elsewhere. (Press enter)

⑤,Install vue-router? (Y/n); is the route installed? (/N ). (You can choose whether to be safe or not)

⑥,Use ESLint to lint your code? (Y/n); Use ESlint syntax? (Y/N ). (To use ESLint syntax, be prepared. Unless you fully understand ESLint syntax, or report errors everywhere, I am forced to go crazy. N is recommended)

7,Setup unit tests with Karma + Mocha? (Y/n); set unit test? (Y/N ). (Select N)

Average,Setup e2e tests with Nightwatch? (Y/n); how can I establish an end-to-end test on the Nightwatch? (Y/N ). (Select N)

If yes, the installation is successful;

      

By default, webpack is installed in the latest version. To install other versions, use the command line vue init webpack #1.0.

Step 7: Go to the project we just created, cd sanfeng1, and install the dependency npm install. The installation is successful, as shown in;

  

Step 8: run the npm run dev project successfully, for example;

  

Open the address and port number in the browser to view our project.

  

 

 

  

 

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.