How to quickly build projects with vue-cli and element-ui

element-ui is a UI framework based on vue2.0 and is currently the most popular framework. This article will introduce to you how to quickly build projects with vue-cli and element-ui.

1. Foreword

The arrival of vue2.0, with its easy-to-learn, complete API Chinese documentation, and rich ecosystem, has become the current domestic The very popular front-end MVVM framework,
element-ui is a UI framework based on vue2.0, developed and maintained by the Ele.me team. It is currently the most popular framework in vue's UI library

2. Code operation

There are two ways to use vue-cli element-ui

Option 1:
①First use vue-cli to build the project,
② Then use npm install the corresponding modules and plug-ins,
③Go to webpack.conf.js to configure the loader of various files,
④Go to .babelrc to configure the plug-in

If the project has not started writing yet, do not use option 1. If the project has been started for a while, then you must handle each step according to the above points. If you are not careful, an error will be reported. Here is the second option, which is to use a template provided by element-ui

Option two:
① Use the git command git clone https://github.com/ElementUI/element-starter.git to download the official template,
② Use cnpm intsall to download dependent modules (if there is no Taobao mirror, cnpm can use npm install)
③ Use npm run dev to run the project

The basic structure of the template is as follows-it is basically the same as the project built using vue-cli scaffolding, very clean

After running the project, you can see a simple page - it has one more element-ui button component than the page of the project built using vue-cli

Then you can use the element-ui library~

A simple application of ElementUI, you can click on the following article Link to enter

Use vue2.0 to quickly build a background addition, deletion, modification and query management interface

3. Other

install parameters

1. Write dependencies

npm install module_name -S

npm install module_name --save

2. Write devDependencies

npm install module_name -D

npm install module_name --save-dev

3. Global installation (command line use)

npm install module_name -g

Related recommendations:

How to use vue- Quickly build a project with cli

How to implement the international development of vue-i18n and element-ui in the vue project

The above is the detailed content of How to quickly build projects with vue-cli and element-ui. For more information, please follow other related articles on the PHP Chinese website!