一、首先使用npm创建vue项目框架:

1、安装vue-cli:    $ npm install --global vue-cli

2、初始化项目:$ npm init webpack  项目名

3、在项目目录下安装element-ui依赖:

$ npm i element-ui -S

import ElementUI from 'element-ui'

import 'element-ui/lib/theme-chalk/index.css'

Vue.use(ElementUI)

4、引入echarts.js图表库:

$ npm install echarts --save

import echarts from 'echarts'

Vue.prototype.$echarts=echarts

5、开始创建项目

个人创建的项目展示地址:GitHub地址:https://github.com/HLHAOGH/myrepository/tree/HLHAOGH-patch-1

6、系统部分截图:

vue-cli+vue 2.0+element-ui+vue-router+echarts.js开发后台管理系统项目教程的更多相关文章

  1. vue Cli 按需引入Element UI 和全局引用Element UI

    全局引用: 一.安装 Element UI npm i element-ui -S 二.在main.js 中引入 element UI import ElementUI from 'element-u ...

  2. 如何在 Vite 中使用 Element UI + Vue 3

    在上篇文章<2021新年 Vue3.0 + Element UI 尝鲜小记>里,我们尝试使用了 Vue CLI 创建 Vue 3 + Element UI 的项目,而 Vue CLI 实际 ...

  3. 2021新年 Vue3.0 + Element UI 尝鲜小记

    2021年,又是新的一年,Vue 已经发布 3.0 版本,最好用的 UI 组件库 Element UI 也发布了适配 Vue3.0 的新版本,是时候开始学习一下这两个新技术. 本文主要记录了使用 Vu ...

  4. vue开发后台管理系统小结

    最近工作需要用vue开发了后台管理系统,由于是第一次开发后台管理系统,中间也遇到了一些坑,想在这里做个总结,也算是对于自己工作的一个肯定.我们金融性质的网站所以就不将代码贴出来哈 一.项目概述 首先工 ...

  5. vue2.0 + Element UI + axios实现表格分页

    注:本文分页组件用原生 html + css 实现,element-ui里有专门的分页组件可以不用自己写,详情见另一篇博客:https://www.cnblogs.com/zdd2017/p/1115 ...

  6. Vue(十八)Element UI

    Elment UI 1. 简介 Element UI是饿了么团队提供的一套基于Vue2.0的组件库,可以快速搭建网站,提高开发效率 ElementUI PC端 MintUI 移动端 [官网](http ...

  7. Vue 基于node npm & vue-cli & element UI创建vue单页应用

    基于node npm & vue-cli & element UI创建vue单页应用 开发环境   Win 10   node-v10.15.3-x64.msi 下载地址: https ...

  8. .Net Core,VUE,VS Code,Sql Sugar,Element UI学习笔记

    1..Net Core的目的是跨平台,并主要目标是作为服务端开发使用.从3.0开始,引入了Winfrom和WPF. 2..Net Core可以引用.Net Framework生成的dll和exe,不限 ...

  9. vue+element 构建的后台管理系统项目(1)新建项目

    1.运行 vue init webpack demo   这里的demo是你项目的名字 2.npm run dev 查看项目启动效果 3.安装Element cd 项目 cmd  运行 npm i e ...

随机推荐

  1. 解决springmvc返回中文乱码问题

  2. Python在office开发中的应用

    Python with Excel 有几个很好的Python模块能够方便地操作Excel的数据,包括读与写,不要求本地安装Excel.例如pandas, openpyxl, xlrd, xlutils ...

  3. 为 Editor.md 编辑器插件增加预览和发布按钮

    前言 一直在使用 Editor.md 插件作为博客的编辑器,用着挺好,但是在全屏下编辑时,每次想预览或者保存又必须切换到非全屏状态下才可以点击按钮,用着不舒服,所以花了一点时间在工具栏上增加了预览.保 ...

  4. 使用FastReport.net 报表在网页上实现打印功能

    这些年的工作当中,最早是在8年前接触到FastReport这个报表工具,从名字上来看,直译过来就是快速报表,正所谓天下武功,唯快不破,FastReport报表早些年确实是制作报表的不二之选,8年前的工 ...

  5. WGAN的改进点和实操

    包含三部分:1.WGAN改进点  2.代码修改  3.训练心得 一.WGAN的改进部分: 判别器最后一层去掉sigmoid    (相当于最后一层做了一个y = x的激活) 生成器和判别器的loss不 ...

  6. 开发者福音!面向Web场景的云开发服务正式开放!

    导 语 继支持小程序开发之后,云开发也支持Web使用啦!开发者们可以使用云开发提供的云端能力,直接开发网站应用,如PC端网页.公众号中的网页等.由此开发者可以在网站应用中借助云函数实现业务逻辑,通过与 ...

  7. 小白开学Asp.Net Core 《十》

    小白开学Asp.Net Core <十> — — Session.Cookie.Cache(老生常谈) 一.背景 在常谈Session和Cookie之前我们先来简单的了解下Http(可以说 ...

  8. 微信小程序的尺寸单位rpx介绍

    rpx单位是微信小程序中css的尺寸单位,rpx可以根据屏幕宽度进行自适应. 规定屏幕宽为750rpx.如在 iPhone6 上,屏幕宽度为375px,共有750个物理像素,则750rpx = 375 ...

  9. 【Python3爬虫】当爬虫碰到表单提交,有点意思

    一.写在前面 我写爬虫已经写了一段时间了,对于那些使用GET请求或者POST请求的网页,爬取的时候都还算得心应手.不过最近遇到了一个有趣的网站,虽然爬取的难度不大,不过因为表单提交的存在,所以一开始还 ...

  10. H3C模拟器单臂路由配置实例

    单臂路由:用802.1Q和子接口实现VLAN间路由 单臂路由利用trunk链路允许多个VLAN的数据帧通过而实现 网络拓扑图: RTA配置: SW1配置: PC1/2配置如图: 但是值得注意的是,在配 ...