前言

本文记录一次使用Vue开源项目的过程。

寻找Vue开源项目

要使用Vue开源项目就必须先找到一个,我们去Github上搜索【后台】,然后使用Vue分类进行检索,找到排名第一的开源框架进行下载—vue-framework-wz

然后新建一个文件夹,将下载解压后的文件放进去,如下图:

运行项目

运行CMD,输入【cd /d F:\Vue\vue-framework-wz-master】

然后输入【npm install】 ,如下图:

然后耐心等待其下载依赖项。

然后,得到结果缺少Python环境,安装失败。。。

解决方案:先安装windows-build-tools——windows构建工具,如下。

npm install --global --production windows-build-tools
npm install -g node-gyp

安装windows-build-tools时需要使用【管理员权限的CMD】,不然会提示【Please restart this script from an administrative PowerShell!】

安装完windows-build-tools和node-gyp后,从新运行一个管理员权限的CMD窗口,再从新运行【F:\Vue\vue-framework-wz-master>npm install】初始化项目。

npm run dev

初始化成功后,运行npm run dev,启动nodejs的服务器,运行网站,结果如下图:

输入账号密码,进入后台管理页面,如下图:

注:想要CMD执行npm开头的命令,需要先安装Nodejs。

调试项目

首先我们安装Visual Studio Code,然后使用文件—打开文件夹,然后找到我们刚才的项目路径,然后打开项目。

然后找到后台首页默认显示的仪表盘的网页,如下图:

然后修改页面的Header。

然后重新回到刚刚的网页。

即不用重启Nodejs服务器,也不用编译,可以看到我们的修改内容已经被更新了。

----------------------------------------------------------

到此Vue开源项目使用探索结束。

----------------------------------------------------------

注:此文章为原创,任何形式的转载都请联系作者获得授权并注明出处!
若您觉得这篇文章还不错,请点击下方的【推荐】,非常感谢!

https://www.cnblogs.com/kiba/p/13596436.html

Vue开源项目使用探索的更多相关文章

  1. 超全的 Vue 开源项目合集,签收一下

    超全的 Vue 开源项目合集,签收一下 xiaoge2016 前端开发 1周前 作者:xiaoge2016 链接: https://my.oschina.net/u/3018050/blog/2049 ...

  2. 20 个新的且值得关注的 Vue 开源项目

    译者:前端小智作者:Nastassia Ovchinnikova来源:flatlogic.com 个人专栏 ES6 深入浅出已上线,深入ES6 ,通过案例学习掌握 ES6 中新特性一些使用技巧及原理, ...

  3. 30个值得关注的Vue开源项目

    译者按: 学习优秀的开源项目是提高代码水平最有效的方式. 原文: 30 Amazing Vue.js Open Source Projects for the Past Year (v.2018) 译 ...

  4. 2018年最值得关注的30个Vue开源项目

    译者按: 学习优秀的开源项目是提高代码水平最有效的方式. 原文: 30 Amazing Vue.js Open Source Projects for the Past Year (v.2018) 译 ...

  5. Vue开源项目汇总(史上最全)(转)

    目录 UI组件 开发框架 实用库 服务端 辅助工具 应用实例 Demo示例 UI组件 element ★13489 - 饿了么出品的Vue2的web UI工具套件 Vux ★8133 - 基于Vue和 ...

  6. vue开源项目有点全

    目录 UI组件 开发框架 实用库 服务端 辅助工具 应用实例 Demo示例 UI组件 element ★31142 - 饿了么出品的Vue2的web UI工具套件 Vux ★14104- 基于Vue和 ...

  7. 操作PDF文档功能的相关开源项目探索——iTextSharp 和PDFBox

    原文 操作PDF文档功能的相关开源项目探索——iTextSharp 和PDFBox 很久没自己写写心得日志与大家分享了,一方面是自己有点忙,一方面是自己有点懒,没有及时总结.因为实践是经验的来源,总结 ...

  8. Vue常用经典开源项目汇总参考-海量

    Vue常用经典开源项目汇总参考-海量 Vue是什么? Vue.js(读音 /vjuː/, 类似于 view) 是一套构建用户界面的 渐进式框架.与其他重量级框架不同的是,Vue 采用自底向上增量开发的 ...

  9. 如何运行vue项目(从gethub上download的开源项目)

    前提:入坑vue.js,从GitHub上download一个vue.js的开源项目,发现不知如何在浏览器运行,通过查阅网上教程,发现网上的很多是教你怎么新建项目,并没有一个是教如何打开已有的项目.自已 ...

随机推荐

  1. C/C++编程笔记:流行的数字游戏【2048】,C语言400行源代码分享

    游戏介绍 你玩过2048吗?2048是一款流行于各大网页和手机的数字游戏,手机安卓版推出的是<挑战2048>,之后的版本中还加入了双人对战的游戏模式,更加受到玩家的热捧. 2048的游戏规 ...

  2. 牛客练习赛63 牛牛的斐波那契字符串 矩阵乘法 KMP

    LINK:牛牛的斐波那契字符串 虽然sb的事实没有改变 但是 也不会改变. 赛时 看了E和F题 都不咋会写 所以弃疗了. 中午又看了一遍F 发现很水 差分了一下就过了. 这是下午和古队长讨论+看题解的 ...

  3. PAM学习笔记

    想了想 还是要先把字符串的东西先都学完告一段落了再说 时间不多了 加油~. PAM 回文自动机 比SAM简单到不知道哪里去了. 回文自动机和其他自动机一样有字符集 有状态 有转移. 一个字符串的回文自 ...

  4. Struts/Servlet,action转到jsp后,CSS失效,路径问题(struts2,jsp路径,action路径,action跳转,相对路径,绝对路径)

    问题:使用struts2,如何处理action的路径?还有,在action转到的jsp中,如何写js,css,图 片的路径?(例如访问http://localhost/project/listUser ...

  5. [转]17个常用的JVM参数

    作者:SimpleSmile_5177 来源:https://www.cnblogs.com/Simple-Object/p/10272326.html 前言 大家都知道,jvm在启动的时候,会执行默 ...

  6. Java自学-JDBC 数据库连接池

    数据库连接池 与线程池类似的,数据库也有一个数据库连接池. 不过他们的实现思路是不一样的. 本章节讲解了自定义数据库连接池类:ConnectionPool,虽然不是很完善和健壮,但是足以帮助大家理解C ...

  7. 15 张精美动图全面讲解 CORS

    前言: 本文翻译自 Lydia Hallie 小姐姐写的

  8. centos,linux环境下安装JDK1.8完整

    进入oracle官网下载安装包,cetos一般选择xx-xx-linux-x64.tar.gz.获取到地址后可以点击下载,也可以使用wget命令下载. 在得到下载好的文件后下面就可以开始安装了.比如我 ...

  9. 打开桌面的Eclipse闪退,打不开

    参考了网上说的方法: .在C:/WINDOWS/system32 系统文件夹中ctrl+F 然后搜索java.exe,如果存在java.exe, javaw.exe etc.全部删除. 2.内存不足, ...

  10. Java基础—对象构造

    1.重载 有些类有多个构造器.例如,可以如下构造一个空的StringBuilder对象: StringBuilder message = new StringBuilder(); 或者,可以指定一个初 ...