一个简单的Vue+ElementUI工程

通过管理员模式打开命令行
输入命令 vue init webpack hello-vue
创建一个名字为"hello-vue"的工程

创建时不要安装任何插件，我们自己安装

cd hello-vue
进入我们的工程内部

接下来安装一些依赖
首先安装路由
npm install vue-router --save-dev
安装element-ui -S
npm i element-ui -S
安装依赖
npm install
安装SASS加载器
cnpm install sass-loader node-sass --save-dev
启动测试
npm run -dev

Npm命令解释
npm install moduleName:安装模块到项目目录下
npm install -g moduleName: -g的意思是将模块安装到全局，具体安装到磁盘的哪个位置，要看npm config
prefix的位置
npm install -save moduleName:–save的意思是将模块安装到项目目录下，并在package文件的dependencies节点写入依赖 -S为该命令的缩写
npm install -save-dev moduleName:–save-dev的意思是将模块安装到项目目录下，并在package文件的dependencies节点写入依赖 -D为该命令的缩写

通过idea打开此工程

创建router和views文件夹
在views中放入组件
创建一个Login.vue

<template>

    <div>
      <el-form ref="loginForm" :model="form" :rules="rules" label-width="80px" class="login-box">
        <h3 class="login-title">欢迎登录</h3>
        <el-form-item label="账号" prop="username">
          <el-input type="text" placeholder="请输入账号" v-model="form.username"/>
        </el-form-item>
        <el-form-item label="密码" prop="password">
          <el-input type="password" placeholder="请输入密码" v-model="form.password"/>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" v-on:click="onSubmit('loginForm')">登录