第一章构建vue项目,代码仓库管理

时间:2022-12-28 20:04:52

一、安装node.js、vue-cli脚手架

1.安装node.js

下载地址:https://nodejs.org/en/download

查看版本号 node -v 、npm -v 出现版本号即安装成

2.管理nodejs版本(非必须装)

执行命令安装:npm install -g n

n latest(升级node.js到最新版本)

n stable(升级node.js到最稳定版)

n 后面可以跟着版本号,例如:$n v0.10.26 或者 $n 0.10.26

3.安装淘宝镜像 cnpm(非必装,网络慢的情况可安装)

npm install -g cnpm --registry=http://registry.npm.taobao.org

4.全局安装vue-cli3.0脚手架

卸载:如果已经全局安装了旧版本的vue-cli(1.x或者2.x),需要先卸载:npm uninstall vue-cli -g

安装:npm install -g@vue-cli

查看版本号:vue -V

二、建立项目仓库(Github)

1.登入github地址,创建新的仓库

第一章构建vue项目,代码仓库管理

2.将项目推到github 上面,参考下面的命令行:

第一章构建vue项目,代码仓库管理

成功后出现以下界面:

第一章构建vue项目,代码仓库管理

三、创建vue项目

1.构建项目

vue create sh3h_common_platform

2.配置信息

第一章构建vue项目,代码仓库管理

由于我们配置了gitignore,因此我们选择【合并】

第一章构建vue项目,代码仓库管理

这里我们使用【自定义选项】,出现如下图界面:

通过上下键+空格选择图中选项即可(也可以根据自己的需求选择)

第一章构建vue项目,代码仓库管理

第一章构建vue项目,代码仓库管理

路由模式有两种:hash、history

Hash-即地址栏ULR中的#符号;如:http://www.taobao.com/#/hello

Histoty-利用了HTML5 History Interface 中新增的 pushState()和replaceState()方法(去除#)

注:由于开发不在乎# 因此选择 n

第一章构建vue项目,代码仓库管理

第一章构建vue项目,代码仓库管理

到此,项目就建设好了。输入图中的命令启动项目:

第一章构建vue项目,代码仓库管理

第一章构建vue项目,代码仓库管理的更多相关文章

  1. 第一章 创建WEB项目

    第一章   创建WEB项目 一.Eclipse创建WEB项目 方法/步骤1 首先,你要先打开Eclipse软件,打开后在工具栏依次点击[File]>>>[New]>>&g ...

  2. vue-cli快速构建vue项目模板

    vue-cli 是vue.js的脚手架,用于自动生成vue.js模板工程的. 1.使用npm安装vue-cli 需要先装好vue 和 webpack(前提是已经安装了nodejs,否则连npm都用不了 ...

  3. 使用nodeJs安装Vue-cli并用它快速构建Vue项目

    部分摘自:http://www.cnblogs.com/wisewrong/p/6255817.html(已在本地测试) 前提:nodeJs本地已安装. 一.安装 vue-cli 1.使用nodeJs ...

  4. vue-cli快速构建Vue项目

    vue-cli是什么? vue-cli 是vue.js的脚手架,用于自动生成vue.js模板工程的. vue-cli怎么使用? 安装vue-cli之前,需要先装好vue 和 webpack npm i ...

  5. MVC5+EF6 简易版CMS(非接口) 第一章:新建项目

    目录 简易版CMS后台管理系统开发流程 MVC5+EF6 简易版CMS(非接口) 第一章:新建项目 MVC5+EF6 简易版CMS(非接口) 第二章:建数据模型 MVC5+EF6 简易版CMS(非接口 ...

  6. 自动化工具构建vue项目

    其实之前对vue的话也有过一段时间的学习,博客园也是写了5篇vue的学习笔记.但是一直是通过CDN的方式在html文件头部引入vue.js,然后实例化vue对象绑定Dom,写组件写方法.就算是在实际项 ...

  7. 团队开发前端VUE项目代码规范

    团队开发前端VUE项目代码规范 2018年09月22日 20:18:11 我的小英短 阅读数 1658   一.规范目的: 统一编码风格,命名规范,注释要求,在团队协作中输出可读性强,易维护,风格一致 ...

  8. vue,一路走来(1)--构建vue项目

    2016年12月--2017年5月,接触前端框架vue,一路走来,觉得有必要把遇到的问题记录下来. 那时,vux用的是1.0的vue,然而vue2.0已经出来了,于是我结合了mint-ui一起来做项目 ...

  9. webpack构建vue项目(配置篇)

    最近公司要求用vue重构项目,还涉及到模块化开发,于是乎,我专门花了几天的时间研究了一下webpack这个目前来看比较热门的模块加载兼打包工具,发现上手并不是很容易,现将总结的一些有关配置的心得分享出 ...

随机推荐

  1. java中关于try、catch、finally中的细节分析

    来源于:http://www.cnblogs.com/aigongsi/archive/2012/04/19/2457735.html 对所有的例子进行总结 1 try.catch.finally语句 ...

  2. UI2_视图切换ViewController

    // // SubViewController.h // UI2_视图切换 // // Created by zhangxueming on 15/7/3. // Copyright (c) 2015 ...

  3. Html5 Canvas学习

    canvas: 首先在html页面中加入canvas标签 <canvas id="canvas" width="1024" height="74 ...

  4. Contaminated Milk

    Contaminated Milk 题目描述 Farmer John, known far and wide for the quality of the milk produced on his f ...

  5. oracle12c:通过oracle客户端工具配置tns,并使用sqlldr进行批量导入数据

    通过oracle客户端工具配置tns: 进入oracle配置工具“Net Configuration Assistant”-> 点击“下一步”,完成tns配置. 测试是否tns可用 命令:tns ...

  6. 深入理解Linux内核 学习笔记(4)

    第四章 中断和异常 中断通常被分为同步中断和异步中断,同步中断是当指令执行时由CPU控制单元产生的,之所以称为同步,是因为只有在一条指令终止执行后CPU才会发出中断异步中断是由其他硬件设备依照CPU时 ...

  7. 解释生成器(generator)于函数的不同,并实现和使用简单generator?

    生成器和函数的主要区别在于函数return avalue,生成器yield  a  value,同事标记或记忆point of the yield 以便在下次调用时从标记点恢复执行,yield使用函数 ...

  8. The Number Games CodeForces - 980E &lpar;树&comma; 贪心&rpar;

    链接 大意: 给定$n$节点树, 求删除$k$个节点, 使得删除后还为树, 且剩余点$\sum{2^i}$尽量大 维护一个集合$S$, 每次尽量添加最大的点即可 这样的话需要支持求点到集合的最短距离, ...

  9. linux保证程序单实例运行

    static int proc_detect(const char *procname){ char filename[100] = {0}; sprintf(filename, "%s/% ...

  10. mygene 3&period;0&period;0

    MyGene.Info provides simple-to-use REST web services to query/retrieve gene annotation data. It’s de ...