使用vue框架开发前端项目的步骤
前端项目的开发
1. 本地安装nodejs https://nodejs.org/en/download/
2. 测试安装
> node -v
3. 本地安装git
> git --version
4. 使用vue-element-admin
https://panjiachen.github.io/vue-element-admin-site/zh/guide
1) 进入项目中(使用的IDE软件为 Visual Studio Code)
> cd vue-element-admin
2)安装依赖(npm install 或 cnpm install)
> npm install (安装依赖) 不做,慢!
为了加快下载速度,先安装cnpm
> npm install -g cnpm --registry=https://registry.npm.taobao.org
> cnpm install
3) 运行项目
> npm run dev
5. 路由重置
src/router/index.js
6. 页面添加
src/pages
1) 编写页面
2) 配置路由
熟练后的步骤:
1. 使用VS Code打开工作空间中的某一文件夹
2.打开Terminal终端,运行以下命令,--depth 1 代表最近一次commit的版本,这样下载速度比较快。
git clone https://github.com/PanJiaChen/vue-element-admin.git --depth 1
3. 运行 cd vue-element-admin-site 命令,进入项目
4. 使用淘宝镜像,运行命令: npm install -g cnpm --registry=https://registry.npm.taobao.org
5. 安装依赖,运行命令: cnpm install
6. 运行项目,运行命令:npm run dev
大功告成!
使用vue框架开发前端项目的步骤的更多相关文章
- 在基于ABP框架的前端项目Vue&Element项目中采用电子签名的处理
在前面随笔介绍了<在基于ABP框架的前端项目Vue&Element项目中采用电子签章处理文件和打印处理>的处理,有的时候,我们在流程中或者一些文件签署的时候,需要签上自己的大名,一 ...
- SSM框架开发web项目系列(二) MyBatis真正的力量
前言 上篇SSM框架环境搭建篇,演示了我们进行web开发必不可少的一些配置和准备工作,如果这方面还有疑问的地方,可以先参考上一篇“SSM框架开发web项目系列(一) 环境搭建篇”.本文主要介绍MyBa ...
- SSM框架开发web项目系列(五) Spring集成MyBatis
前言 在前面的MyBatis部分内容中,我们已经可以独立的基于MyBatis构建一个数据库访问层应用,但是在实际的项目开发中,我们的程序不会这么简单,层次也更加复杂,除了这里说到的持久层,还有业务逻辑 ...
- 每天一点点之vue框架开发 - 使用vue-router路由
1.安装路由(安装过的跳过此步) // 进入项目根目录 cd frontend // 安装 npm install vue-router --save-dev 2.在入口文件main.js中引入路由 ...
- YII框架开发一个项目的通用目录结构
YII框架开发一个项目的通用目录结构: 3 testdrive/ 4 index.php Web 应用入口脚本文件 5 assets/ 包含公开的资源文件 6 css/ 包含 CSS 文件 7 ima ...
- SSM框架开发web项目系列(三) MyBatis之resultMap及关联映射
前言 在上篇MyBatis基础篇中我们独立使用MyBatis构建了一个简单的数据库访问程序,可以实现单表的基本增删改查等操作,通过该实例我们可以初步了解MyBatis操作数据库需要的一些组成部分(配置 ...
- 每天一点点之vue框架开发 - 引入Jquery
1. 安装jquery npm install jquery --save-dev 2.在build/webpack.base.conf.js中添加如下内容 var webpack = require ...
- Vue实例:vue2.0+ElementUI框架开发pc项目
开发前准备 vue.js2.0中文,项目所使用的js框架 vue-router,vue.js配套路由 vuex,状态管理 Element,UI框架 1,根据官方指引,构建项目框架 安装vue npm ...
- 在基于ABP框架的前端项目Vue&Element项目中采用日期格式处理,对比Moment.js和day.js的处理
Day.js 是一个轻量的处理时间和日期的 JavaScript 库,和 Moment.js 的 API 设计保持完全一样. 如果您曾经用过 Moment.js, 那么您已经知道如何使用 Day.js ...
随机推荐
- js 模拟鼠标拖动
window.addEventListener('message', function (event) { if (event.source != window) return; if (event. ...
- nginx防盗链处理模块referer和secure_link模块
使用场景:某网站听过URI引用你的页面:当用户在网站点击url时:http头部会通过referer头部,将该网站当前页面的url带上,告诉服务本次请求是由这个页面发起的 思路:通过referer模块, ...
- MFC加载图片
目录 1. 自适应方法 2. 加载原图方法 1. 自适应方法 /* 自适应方法 */ CRect rect; CRect rect1; CImage image; //创建图片类 image.Load ...
- Linux centosVMware 自动化运维Ansible介绍、Ansible安装、远程执行命令、拷贝文件或者目录、远程执行脚本、管理任务计划、安装rpm包/管理服务、 playbook的使用、 playbook中的循环、 playbook中的条件判断、 playbook中的handlers、playbook实战-nginx安装、管理配置文件
一.Ansible介绍 不需要安装客户端,通过sshd去通信 基于模块工作,模块可以由任何语言开发 不仅支持命令行使用模块,也支持编写yaml格式的playbook,易于编写和阅读 安装十分简单,ce ...
- 【动画演示】:JS 作用域链不在话下
作者:Lydia Hallie译者:前端小智来源:dev 点赞再看,养成习惯 本文 GitHub https://github.com/qq44924588... 上已经收录,更多往期高赞文章的分类, ...
- 傅盛读书笔记:下一个Moonshot是什么?
猎豹移动CEO 傅盛 九月底,我有幸在硅谷拜访了苹果前CEO斯卡利.老人如今已经75岁高龄,但看起来仍充满活力.他花了一上午的时间跟我们沟通,非常谦和.平等.坦诚,给我留下了很深的印象.末了,给我们介 ...
- 常用的UI控件
关于本文:作为一名iOS软件工程师,熟练规范的使用常用的UI控件是必备的基础技能. 指示器(UIActivityIndicatorView)----转动的等待小菊花 提醒对话框(UIAlertView ...
- 网络请求中的URL中传bool型数据
如果在URL中要拼接bool的数据,OC这边不能使用BOOL型.因为使用NSString的拼接字符串类方法中,会将BOOL型数据转化为0或者1. 解决办法: NSString *overdue_str ...
- spark广播变量定时更新
广播变量 先来简单介绍下spark中的广播变量: 广播变量允许程序员缓存一个只读的变量在每台机器上面,而不是每个任务保存一份拷贝.例如,利用广播变量,我们能够以一种更有效率的方式将一个大数据量输入集合 ...
- 洛谷 P2891 [USACO07OPEN]吃饭Dining
裸的最大流. #include <cstdio> #include <cstring> #include <queue> const int MAXN = 4e3 ...