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

一、安装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 [email protected]

查看版本号:vue -V

二、建立项目仓库(Github)

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

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

成功后出现以下界面:

三、创建vue项目

1.构建项目

vue create sh3h_common_platform

2.配置信息

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

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

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

如果不会TypeScript,不用选择

路由模式有两种:hash、history

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

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

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

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

原文地址:https://www.cnblogs.com/wangchao1990/p/12678704.html

时间: 2024-11-08 15:58:27

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

第一章 创建WEB项目

第一章   创建WEB项目 一.Eclipse创建WEB项目 方法/步骤1 首先,你要先打开Eclipse软件,打开后在工具栏依次点击[File]>>>[New]>>>[Dynamic Web Project],这个就代表新建的项目是WEB项目 提示:如果没有找到[Dynamic Web Project]请看下一步 2 如果我们找不到[Dynamic Web Project]这个选项,说明以前没有建立过WEB项目,所以不在快捷导航里,这时我们点击[Other]这个选项

webpack构建Vue项目引入jQ时发生“'$' is defined but never used”的处理

今天公司需要新建个数据后台,就按照查到的方法构建了Vue框架的项目,引入jQ.bootstrap时,按照在线方法配置,发现 main.js 里的引用jQ一直显示红标,没多想,在按照网上配置完后,npm run dev运行,就抛出这么个错误,百思不得解 错误如下: '$' is defined but never used 1 http://eslint.org/docs/rules/space-before-function-paren 1 http://eslint.org/docs/rule

vue-cli快速构建Vue项目

vue-cli是什么? vue-cli 是vue.js的脚手架,用于自动生成vue.js模板工程的. vue-cli怎么使用? 安装vue-cli之前,需要先装好vue 和 webpack npm install -g vue //全局安装vue npm install -g webpack //全局安装webpack npm install -g vue-cli //全局安装vue-cli 注意:上面这些装过一次之后都不需要再安装了比如说我的项目要生成在D:/project下面那么先进到目录里

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

团队开发前端VUE项目代码规范 2018年09月22日 20:18:11 我的小英短 阅读数 1658 一.规范目的: 统一编码风格,命名规范,注释要求,在团队协作中输出可读性强,易维护,风格一致的代码 二.开发SRC目录: 1.Vuex目录 (状态树配置) 2.Router目录(路由配置) 3.Pages目录 (放置主路由组件 注意命名规范) 4.Common目录 (放置静态文件) 5.Config目录 (全局配置项,路由拦截,报错信息,等枚举信息) 6.Api目录 ( 相关全局请求调用配置.

webpack构建vue项目(配置篇)

最近公司要求用vue重构项目,还涉及到模块化开发,于是乎,我专门花了几天的时间研究了一下webpack这个目前来看比较热门的模块加载兼打包工具,发现上手并不是很容易,现将总结的一些有关配置的心得分享出来,欢迎大神来拍砖... 一.新建一个项目目录,cd /d 定位进去,然后输入npm init,会提示你填写一些项目的信息,一直回车默认就好了,或者直接执行npm init -y 直接跳过,这样就在项目目录下生成了一个package.json文件. 二.接下来就是通过npm安装项目依赖项,命令行输入

webpack + vue2 构建vue项目骨架

前端项目打包工具webpack与前端开发框架vue,算是现在前后端分离后非常流行的技术了,今天主要讲的是使用webpack和vue2构建一个前后端分离项目的基本骨架.虽然使用vue-cli脚手架可以帮我们搭建好一个项目骨架,但是了解原理我觉得还是很重要的,所以这篇文章主要就写webpack与vue构建一个基础项目.前提是已经安装了nodejs. 整个项目需要通过npm安装的依赖 css : style-loader.css-loader.sass-loader.node-sass js:babe

vue-cli 构建vue项目

师父说,咱们还是要用vue-cli 去构建前端项目.然后我就开始了 懵逼之旅. 今天上午主要就是搞懂用webpack和vue-cli怎么搭建 运行项目 首先找到了咱们博客园 园友的博客,提供了大概五个步骤吧. 1.装node.js 装完这个就可以用npm命令去装其它东西了. 出版本号了 就代表装成功了 2.装vue-cli npm install -g vue-cli 在node的命令行界面 或者cmd的命令行 都可以输入这行命令 同理 出了版本号 就代表装成功了. 3.使用vue-cli初始化

利用webpack构建vue项目

快速搭建vue项目 一,确认自己有无搭建好node以及npm环境,这些是前提,具体安装方法可参考https://nodejs.org/en/. 二,开始构建项目. 第1步:新建一个文件夹,随意命名. 第2步:通过vue-cli来构建项目,vue-cli是vue的脚手架工具,可通过命令行: npm install -g vue-cli 来进行安装.vue-cli只用安装一次,以后可以不用再安装. 第3步:在安装完vue-cli之后,找到自己新建的文件夹,并在这里打开命令提示符cmd.可以通过按住s

Jenkins自动化构建vue项目然后发布到远程服务器

部署Jenkins参照另一篇博客: centos7安装Jenkins及其卸载 一.jenkins相关插件的安装 1.安装Publish Over SSH插件用于SSH连接远程的服务器. 登录 jenkins 管理系统首页,打开“系统管理”--“管理插件”  搜索 Publish Over SSH 然后勾选安装 2.安装 NodeJs插件 用于vue项目打包构建. 打开“系统管理”--“管理插件”  搜索 nodejs 然后勾选安装 打开“系统管理”--“Global Tool Configura