vue+element 构建的后台管理系统项目(1)新建项目
1.运行 vue init webpack demo 这里的demo是你项目的名字
2.npm run dev
查看项目启动效果

3.安装Element
cd 项目
cmd 运行
npm i element-ui -S
4.在main.js 引入element
// The Vue build version to load with the `import` command
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
import Vue from 'vue'
import App from './App'
import router from './router'
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css' Vue.config.productionTip = false Vue.use(ElementUI);
/* eslint-disable no-new */
new Vue({
el: '#app',
router,
components: { App },
template: '<App/>'
})
注意这里有个坑
我本来引入的代码是
import 'element-ui/lib/theme-default/index.css'
npm 运行保错

通过修改为
import 'element-ui/lib/theme-chalk/index.css'
就运行成功
下面看看运行起来的效果

效果:

vue+element 构建的后台管理系统项目(1)新建项目的更多相关文章
- vue+element搭建的后台管理系统
最近工作不是很忙,自己在学习vue,在网上找了一个简单的项目练练手..... 这是本人的gitHub 上的项目地址:https://github.com/shixiaoyanyan/vue-admin ...
- 在微信框架模块中,基于Vue&Element前端的后台管理功能介绍
微信开发包括公众号.企业微信.微信小程序等方面的开发内容,需要对腾信的微信API接口进行封装:包括事件.菜单.订阅用户.多媒体文件.图文消息.消息群发.微信支付和企业红包.摇一摇设备.语义理解.微信小 ...
- Vue + Element UI 实现权限管理系统
Vue + Element UI 实现权限管理系统 前端篇(一):搭建开发环境 https://www.cnblogs.com/xifengxiaoma/p/9533018.html
- 基于VUE实现的新闻后台管理系统-一
基于VUE实现的新闻后台管理系统 前段时间拿到一个关于新闻后台的API,测试数据库使用SQLite,Restful服务是用Go写的,只要运行特定环境下的脚本(run.*)就会启动一个服务,依次后台为接 ...
- 基于electron+vue+element构建项目模板之【创建项目篇】
1.概述 electron:使用javascript.css.html构建跨平台的桌面应用程序 vue:数据驱动视图中的一款渐进式的javascript框架 element:基于vue的桌面端UI组件 ...
- 基于VUE实现的新闻后台管理系统-三
开始coding啦 ¶分析项目 根据展示效果我们可以分析出,Web页面有两个,一个用于登录,一个用于系统内容控制,我们分别将其命名为Login和Cms,然后进行路由配置. 在src/page下新建Lo ...
- vue中如何实现后台管理系统的权限控制
vuejs单页应用的权限管理实践 一.前言 在广告机项目中,角色的权限管理是卡了挺久的一个难点.首先我们确定的权限控制分为两大部分,其中根据粒的大小分的更细: 接口访问的权限控制 页面的权限控制 菜单 ...
- Vue + Element UI 实现权限管理系统 前端篇(十一):第三方图标库
使用第三方图标库 用过Elment的同鞋都知道,Element UI提供的字体图符少之又少,实在是不够用啊,幸好现在有不少丰富的第三方图标库可用,引入也不会很麻烦. Font Awesome Font ...
- Vue + Element UI 实现权限管理系统(第三方图标库)
使用第三方图标库 用过Elment的同鞋都知道,Element UI提供的字体图符少之又少,实在是不够用啊,幸好现在有不少丰富的第三方图标库可用,引入也不会很麻烦. Font Awesome Font ...
随机推荐
- 【记录】linux 常用命令梳理
命令梳理 下载文件 [wget 是一个十分常用命令行下载工具,多数Linux发行版本都默认包含这个工具] wget -c [zip路径等] #断点续传,如果下载中断,那么连接恢复时会从上次断点开始下载 ...
- shell数组变量
- linux学习总结--linux100day(day1)
写在前面:我是一名在学习linux的小学生,最近在学习python时,我的老师推荐了github上的一本教材“python100day”,100day里面的内容由浅入深,且都具备详细的例子,对于我这个 ...
- mysql-视图及索引简介
一.视图的创建.作用及注意事项 1.创建:create view 视图名 as select 语句: 2.删除:drop view 视图名 3.作用: 数据库视图允许简化复杂查询 数据库视图有助于限制 ...
- Java 注解处理器
在Android开发中常用到一些第三方注解框架来简化代码.加快开发,如ButterKnife,androidannotations. 虽然常会用到,但没研究过其生成代码的原理,趁年后不忙,又温习了注解 ...
- 几种任务调度的 Java 实现方法与比较(定时任务)(转)
转自:http://blog.csdn.net/javafay/article/details/8031269 综观目前的 Web 应用,多数应用都具备任务调度的功能.本文由浅入深介绍了几种任务调度的 ...
- mysql查找字段空、不为空的方法总结
1.不为空 Select * From table_name Where id<>'' Select * From table_name Where id!='' 2.为空 Select ...
- PHP FILTER_SANITIZE_EMAIL 过滤器
定义和用法 FILTER_SANITIZE_EMAIL 过滤器删除字符串中所有非法的 e-mail 字符. 该过滤器允许所有的字母.数字以及 $-_.+!*'{}|^~[]`#%/?@&= N ...
- flutter duplicate symbol '_GetDirectoryOfType' in:
ld: warning: directory not found for option '-F/Users//codingProject/vipidea-app/ios/Runner/SuperPla ...
- solidity代码
http://www.tryblockchain.org/ 教你如何舒服的看solidity代码 最近智能合约随着区块链技术的发展越发收到广大技术人员的重视! 其中最被看好的以太坊就是一个提供智能合约 ...