Vue开源项目使用探索

前言

本文记录一次使用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.runoob.com/vue2/vue-directory-structure.html

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

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

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

注：此文章为原创，任何形式的转载都请联系做者得到受权并注明出处！
若您以为这篇文章还不错，请点击下方的【推荐】，很是感谢！

http://www.javashuo.com/article/p-vpibtaqx-nh.html