Home >Web Front-end >Vue.js >How to install dependencies in vuejs

How to install dependencies in vuejs

青灯夜游
青灯夜游Original
2021-09-26 17:32:1516386browse

How to install dependencies in vuejs: 1. Install node and cnpm; 2. Install the vue-cli scaffolding construction tool; 3. Build the project with vue-cli; 4. Open the cmd command window and use the cd command to enter In the specific project folder; 5. Execute the "cnpm install" command to install the dependencies.

How to install dependencies in vuejs

The operating environment of this tutorial: windows7 system, vue2.9.6 version, DELL G3 computer.

1. Development environment

vue recommended development environment:

Node.js: javascript running environment (runtime), Different systems directly run various programming languages

npm: Package manager under Nodejs.

webpack: Its main purpose is to prepare all static resources that need to be published by the browser through CommonJS syntax, such as merging and packaging resources.

vue-cli: User-generated Vue project template

2. Environment setup

Install node.js:
1. Download and install node from the node.js official website. The installation process is very simple.
2. The npm version needs to be greater than 3.0. If it is lower than this version, you need to upgrade it:

# 查看版本
$ npm -v
2.3.0

#升级 npm
cnpm install npm -g

3. Based on node.js, use Taobao npm mirror to install related dependencies. Since using npm in China will be very slow, it is recommended to use Taobao NPM mirror (http://npm.taobao.org/)

$ npm install -g cnpm --registry=https://registry.npm.taobao.org

After completion, we can use cnpm instead of npm to install dependent packages.

3. Install the vue-cli scaffolding construction tool

Install the global vue-cli scaffolding to help build the required template framework

$ cnpm install -g vue-cli
# 回车,等待安装...
$ vue
# 回车,若出现vue信息说明表示成功

4. Build the project with vue-cli

# 创建一个基于 webpack 模板的新项目
$ vue init webpack my-project
# 这里需要进行一些配置,默认回车即可
This will install Vue 2.x version of the template.

For Vue 1.x use: vue init webpack#1.0 my-project

? Project name my-project
? Project description A Vue.js project
? Author runoob <test@runoob.com>
? Vue build standalone
? Use ESLint to lint your code? Yes
? Pick an ESLint preset Standard
? Setup unit tests with Karma + Mocha? Yes
? Setup e2e tests with Nightwatch? Yes

   vue-cli · Generated "my-project".

   To get started:

     cd my-project
     npm install
     npm run dev

   Documentation can be found at https://vuejs-templates.github.io/webpack

5. Install dependencies

In cmd

1). Enter : cd my-project (project name) , press Enter, enter the specific project folder

2). Enter: cnpm install, press Enter, wait for a while After a while

Go back to the project folder and you will find that there is an additional node_modules folder in the project structure (the contents of this file are the previously installed dependencies)

6. Test whether the environment is set up successfully

Method 1: Enter in cmd: npm run dev

Method 2: Enter in browser: localhost:8080 (default The port is 8080)

Related recommendations: "vue.js Tutorial"

The above is the detailed content of How to install dependencies in vuejs. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn