vue项目中，element组件的安装和使用的方法

1、新建vue项目

     一、选取项目目录，在命令行中运行命令 vue init webpack vueFirst 。解释一下这个命令，这个命令的意思是初始化一个项目，其中webpack是构建工具，也就是整个项目是基于webpack的。其中vueFirst 是整个项目文件夹的名称。

请注意：

vue2.0版本安装时会出现如图所示的状况

WULI乖乖，有WARN！！！。别慌张。画中的部分已经显示finished啦，因此能够继续开发的宝宝。

有疑问能够浏览文章 https://my.oschina.net/u/3797724/blog 有说明哦

    打开vueFirst 文件夹，项目文件以下所示。

 

二、安装依赖

       继续在命令行中依次输入如下命令：

         cd vueFirst 

         npm run dev

三、运行项目(通常默认是8080端口，打开浏览器输入localhost:8080)

    请注意：

        8080端口若是被占用了，须要修改一下配置文件config/index.js

更改后便可正常显示vue默认主页了。WULI乖乖

2、下面引入Element

一、在当前目录下，命令行中运行:npm i element-ui -S（高效实用：cnpm i element-ui -S）

       舒适提示：vue项目运行时的时候没要输入命令的话，要先退出执行

                        “Ctrl+C”

                        退出后便可运行其余命令啦！WULI乖乖

二、在src/main.js中添加代码（红色的）

三、而后在.vue文件里就直接能够用了

        在src/components/Hello.vue作一下修改（红色框内）

四、 执行命令：cnpm run dev 运行查看

五、上述（2）有时会报错，一是查看element-ui的index.css路径是否正确，第二由于报错会显示找不到文件，须要在build/webpack.base.conf.js文件中添加一段代码，以下。

六、执行命令：cnpm run dev 运行查看

WULI乖乖 运行起来了呦。