vue学习过程总结(02)- 网上开源项目vue-element-admin的启动
1.功能丰富的项目:https://github.com/PanJiaChen/vue-element-admin.git
因为我配置的时候,遇到许多的问题,用了一天半才启动的,所以安着他文档一步一步来。下面我梳理一下整个过程。
1.1.克隆项目,使用github工具克隆项目,没有的可以去下载:https://git-scm.com/download/win
# 克隆项目
git clone https://github.com/PanJiaChen/vue-element-admin.git
1.2.进入项目的根目录。
# 进入项目目录
cd vue-element-admin
1.3.安装项目的依赖包。执行的是根目录下的package.json文件,会下载package.json文件中"dependencies"和"devDependencies"中指定的包。
# 安装依赖
npm install
安装成功的话,会在项目的根目录出现node_modules目录,里面有很多的依赖包。关于install几个我遇到的问题以及我整理的解决方法(我就是卡这里的,遇到了几个问题)。
1.
错误信息:
npm ERR! Error while executing:
npm ERR! C:\Program Files\Git\mingw64\bin\git.EXE ls-remote -h -t git://github.c om/adobe-webplatform/eve.git
npm ERR!
npm ERR! fatal: unable to connect to github.com:
npm ERR! github.com[0: 52.69.186.44]: errno=Result too large
对策:
git config --global url."https://".insteadOf git:// 2.
错误信息:
ailed to connect to github.com port 443: Timed out
对策:
$ git config --global http.proxy https://username:password@proxyserverip:port
git config --get http.proxy 3.(这个不是这里遇到的,我自己先记录这里)
npx webpack -v
执行错误Error: Cannot find module 'webpack-cli' 对策:
需要全局安装webpack-cli
npm install webpack-cli -g
1.4.安装npm的淘宝镜像cnpm,这一步我跳过去了,我配置vue的开发环境是安装了一个全局的npm淘宝镜像。如果经过1.3还是安装包不成功,试试用cnpm,总之一个一个尝试着,看能能解决吧。
# 建议不要直接使用 cnpm 安装依赖,会有各种诡异的 bug。可以通过如下操作解决 npm 下载速度慢的问题
npm install --registry=https://registry.npm.taobao.org
1.5.启动这个vue项目。
npm run dev
浏览器访问 http://localhost:9527,可以看到登录页面就成功了。
2.vue开发工具的选择。
eclipse开发工具:在eclipse的软件市场上搜索vue.js的插件,网上说这个插件不是免费,可以试用一个月。
Intellj idea开发工具:一直用eclipse,所以想换换新的工具。下载地址:https://www.jetbrains.com/idea/download/#section=windows
建议使用社区版(Community)的zip包,解压直接就可以用了,不用安装。
2.1.Intellj idea开发工具下载vue.js插件
如果是内网需要配置代理:File--Settings--搜索proxy--选择HTTP Proxy,进入到代理配置界面,选择Manual proxy configuratio,配置相关的代理服务器的ip和端口。
下载插件:File--Settings--Plugins--搜索vue.js--install. 重启Intellj idea
2.2.导入vue项目.
File--Open--选择项目的根路径
3.1.极其简单干净的模板,少的很多的功能以及依赖包:https://github.com/PanJiaChen/vue-admin-template.git
这个可以用当做基础的一个vue项,可以用来做项目的初始化。
3.2.vue极简模板(只有登录菜单):https://github.com/woai3c/vue-admin-template
vue学习过程总结(02)- 网上开源项目vue-element-admin的启动的更多相关文章
- 关于个人开源项目(vue app)的一些总结
关于个人开源项目(vue app)的一些总结 项目地址 https://github.com/BYChoo/record 项目简介 此项目名叫:Record.是以Vue全家桶(vue,vue-rout ...
- [ABP开源项目]--vue+vuex+vue-router+EF的权限管理系统
好久没写文字了,当然大家也不期待嘛,反正看代码就行了. 演示网站 首先说下这个项目吧. 如标题一样是基于VUE+.NET开发的框架,也是群友一直吼吼吼要一个vue版本的ABP框架. 我们先来看看首页吧 ...
- 进击中的Vue 3——“电动车电池范围计算器”开源项目
转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具.解决方案和服务,赋能开发者. 原文参考:https://dzone.com/articles/build-a-tesla-battery- ...
- 一、Uniapp+vue+腾讯IM+腾讯音视频开发仿微信的IM聊天APP,支持各类消息收发,音视频通话,附vue实现源码(已开源)-项目引言
项目文章索引 1.项目引言 2.腾讯云后台配置TXIM 3.配置项目并实现IM登录 4.会话好友列表的实现 5.聊天输入框的实现 6.聊天界面容器的实现 7.聊天消息项的实现 8.聊天输入框扩展面板的 ...
- 基于Spring Boot+Spring Security+JWT+Vue前后端分离的开源项目
一.前言 最近整合Spring Boot+Spring Security+JWT+Vue 完成了一套前后端分离的基础项目,这里把它开源出来分享给有需要的小伙伴们 功能很简单,单点登录,前后端动态权限配 ...
- gin+vue的前后端分离开源项目
该项目是gin+vue的前后端分离项目,使用gorm访问MySQL,其中vue前端是使用vue-element-admin框架简单实现的: go后台使用jwt,对API接口进行权限控制.此外,Web页 ...
- Vue学习手记01-安装和项目创建
1.安装Vue 注:node版本必须大于等于8.9 vue-cli3.x:npm install -g @vue/cli vue-cli2.x:npm install -g @vue/cli-i ...
- 微人事 star 数超 10k,如何打造一个 star 数超 10k 的开源项目
看了下,微人事(https://github.com/lenve/vhr)项目 star 数超 10k 啦,松哥第一个 star 数过万的开源项目就这样诞生了. 两年前差不多就是现在这个时候,松哥所在 ...
- Android 开源项目 eoe 社区 Android 客户端(转)
本文内容 环境 开源项目 eoe 社区 Android 客户端 本文介绍 eoe 社区 Android 客户端.它是一个开源项目,功能相对简单,采用侧边菜单栏.可以学习一下.点击此处查看 GitHub ...
随机推荐
- 微服务与SpiringBoot
微服务: 微服务是一种架构风格,一般说到微服务都会说"微服务架构",即一个系统的各个功能(如结账,用户等)独立出来,以及各个服务独立出来,每个模块是可独立替换.可独立升级的软件单元 ...
- 在公司内部网络如何搭建Python+selenium自动化测试环境
在公司内部安装Python+selenium测试环境,由于不能连外网所以不能使用pip命令进行安装,经过多次尝试终于安装成功,现总结如下分享给大家,也希望跟大家一起学习和交流自动化网页测试时遇到的问题 ...
- x86架构中的外部中断结构-Part 1:中断控制器的演化
本文主要讲解了x86体系架构从外部设备接受中断的过程,本文是系列文章的第一部分,试图回答以下问题: 什么是PIC以及它的用途是什么? 什么是APIC以及它的用途是什么?LAPIC和I/O APIC的目 ...
- Solution -「ABC 213H」Stroll
\(\mathcal{Description}\) Link. 给定一个含 \(n\) 个结点 \(m\) 条边的简单无向图,每条边的边权是一个常数项为 \(0\) 的 \(T\) 次多项式, ...
- .NET core实现一个简易的事件协调器(saga)
在领域驱动设计中,由于领域边界的存在,以往的分层设计中业务会按照其固有的领域知识被切分到不同的限界中,并且引入了领域事件这一概念来降低单个业务的复杂度,通过非耦合的事件驱动来完成复杂的业务.但是事件驱 ...
- 数据缓存Cache
在MyBatis - 随笔分类 - 池塘里洗澡的鸭子 - 博客园 (cnblogs.com)中有关于Mybatis中Cache技术实现及应用介绍.Cache技术实现都是implements Cache ...
- python-关键字驱动接口框架中,接口关联字段进行值替换的实现方式
前言 编写关键字驱动的接口自动化测试框架中,通过不同的取值方式,将需要关联的字段以及取出的值放到一个空字典中,需要将关联的字段进行值替换,下面是替换的实现方式 实现思路 import re temp_ ...
- 攻防世界Web_ics_05
题目: 题目描述:其他破坏者会利用工控云管理系统设备维护中心的后门入侵系统 题目场景: 1.进入云平台设备中心界面,查看以下源码发现?page= ,(点下云平台设备维护中心url里也能出?page ...
- Windows server 2012安装VM tools异常解决办法
在VMWare虚拟机上安装Windows Server 2012之 后安装VMWare Tools时报如下错误信息: 问题:缺少KB2919355补丁 (先安装KB2919442,在安装KB29193 ...
- python数据结构:链表
链表与列表.数组这线性结构不同之处在于其在首末两端增删的话比较方便 单链表: 但是链表查找和删除的话都是需要从第一个开始从头查找 因此查找和删除的复杂度都为O(n) 双链表: 相比单链表来说,每个节点 ...