Environment set up

Node.js is the javascript runtime environment

NPM: node.js package manager

Webpack: The main purpose of webpack is to use CommonJS syntax to prepare all static resources that need to be published on the browser side, such as resource consolidation and packaging

Vue-cli: The user generates a VUE project template

Installation node. Js

Download and install Node from the Node. js website.

After the installation is complete, run the node -v command to view the current version

Install vuE-CLI scaffold builder tool

If the old version is already installed globally, uninstall it by NPM uninstall vue-cli -g first

Run NPM install -g@vue /cli from the command line to install the latest version

Run vue –version to view the installed version

Create a project

Vue create project-name Creates a VUE project

Select manual configuration (Figure 1)

Select or cancel the blank space. The selected feature is shown in Figure 2

Press Enter to continue

Router configuration (Figure 3)

CSS pre-processor Sass/SCSS (with Dart-SASS) (Figure 4)

And then I’m gonna hit Enter

After the build is successful (Figure 6), follow the prompts to open the created project and passnpm run serveStart the built project

Figure 7 shows the local address of the project, which is accessed to see the built project