Vue+Webpack构建去哪儿APP_一.开发前准备
一、开发前准备
1.node环境搭建
去node.js官网下载长期支持版本的node,采用全局安装,安装方式自行百度
安装后在cmd命令行运行如下代码,若返回版本信息则说明安装成功
node -v

2.GitHub创建-码云
整个项目通过码云来托管代码,用到的工具是Git。
2.1.创建码云账号
进入码云官网,注册一个码云账号
2.2.创建一个git仓库
创建一个名为qunaer-app的项目仓库,注意:最新版本的vue不支持创建大写名称的项目:

2.3.配置本地git环境
去git官网下载git并安装,安装方式自行百度
安装后运行git的命令行工具Git Bash,运行如下命令检测版本信息:
git --version
配置git用户名称和邮箱,这样做很重要,因为每一个 Git 的提交都会使用这些信息,并且它会写入到你的每一次提交中,不可更改:
git config --global user.name "ashan"
git config --global user.email 14718061295@163.com
2.4.生成本地ssh公钥
git bash运行以下命令,生成本地ssh公钥,双引号内为邮箱:
ssh-keygen -t rsa -C "14718061295@163.com"
git bash运行以下命令,查看ssh公钥:
cat ~/.ssh/id_rsa.pub
2.5.将本地ssh公钥添加到码云
将2.4生成的ssh公钥添加到线上仓库

3.将项目下载到本地
在本地创建一个vueProject文件夹,git bash进入到此文件夹,运行以下命令,将项目下载到本地
git clone 项目地址
项目地址 从你的仓库中克隆,相应更改,如图:

4. 配置vue+webpack项目
4.1.安装vue脚手架工具
npm install -g @vue/cli
4.2.创建vue项目
进入到vue项目文件夹,创建vue项目(同时安装webpack依赖)
cd vueProject
vue init webpack qunaer-app
在安装选项中选择 2 (merge)
安装完成后,运行:
cd qunaer-app/
npm run dev
在浏览器中访问:http://localhost:8080,出现如下界面,说明项目创建成功:

4.3.将项目上传到码云
gid add .
git commit -m 'project init initialized'
git push
-------------持续更新中-------------
Vue+Webpack构建去哪儿APP_一.开发前准备的更多相关文章
- Vue+Webpack构建移动端京东金融(一、开发前准备)
一.开发前准备 1.node环境搭建 去node.js官网下载长期支持版本的node,采用全局安装,安装方式自行百度 网址:https://nodejs.org/zh-cn/ 安装后在cmd命令行运行 ...
- Vue+webpack构建一个项目
1.安装CLI命令的工具 推荐用淘宝的镜像 npm install -g @vue/cli @vue/cli-init 2.使用命令构建一个名为myapp的项目 vue init webpack m ...
- vue+webpack构建项目
概述 -- 项目中会用到的插件 vue-router vue-resource 打包工具 webpack 依赖环境 node.js start 安装vue开发的模板 # 全局安装 vue-cli $ ...
- Vue+webpack配置实现多页面应用开发
为什么要配置多页面开发? · 由于单页面应用不利于SEO,对于某些资讯类网站不够友好,而多页面则能够更优的解决此问题. · 传统的多页面开发模式(如java的jsp等) 前后端耦合性大,开发效率低,代 ...
- 为什么vue+webpack需要用到node,如何部署项目到服务器?
第一部分 之前一直不太理解为什么要使用vue+webapck,还有在使用了vue-cli之后会用到后台,即vue-cli自动帮我们安装了express服务器,在本地服务器上运行,因为我们希望可以模拟在 ...
- webpack搭建多页面系统(一):对webpack 构建工具的理解
为什么使用webpack构建工具? 1.开发效率方面: 在一般的开发过程中,分发好任务后,每个人完成自己单独的页面,如果有的人开发完成之后,接手别人的任务,就有可能造成开发时候的冲突. 如果利用模块化 ...
- webpack构建vue项目(配置篇)
最近公司要求用vue重构项目,还涉及到模块化开发,于是乎,我专门花了几天的时间研究了一下webpack这个目前来看比较热门的模块加载兼打包工具,发现上手并不是很容易,现将总结的一些有关配置的心得分享出 ...
- 深入浅出的webpack构建工具--webpack4+vue搭建环境 (十三)
深入浅出的webpack构建工具--webpack4+vue搭建环境 (十三) 从上面一系列的webpack配置的学习,我们现在来使用webpack来搭建vue的开发环境.首先我们来设想下我们的项目的 ...
- 使用webpack+vue.js构建前端工程化
参考文章:https://blog.csdn.net/qq_40208605/article/details/80661572 使用webpack+vue.js构建前端工程化本篇主要介绍三块知识点: ...
随机推荐
- JAVA Freemarker + Word 模板 生成 Word 文档 (普通的变量替换,数据的循环,表格数据的循环,以及图片的东替换)
1,最近有个需求,动态生成 Word 文当并供前端下载,网上找了一下,发现基本都是用 word 生成 xml 然后用模板替换变量的方式 1.1,这种方式虽然可行,但是生成的 xml 是在是太乱了,整理 ...
- python算法之插入排序
插入排序非常类似于整扑克牌.在开始摸牌时,左手是空的,牌面朝下放在桌上.接着,一次从桌上摸起一张牌,并将它插入到左手一把牌中的正确位置上.为了找到这张牌的正确位置,要将它与手中已有的牌从右到左地进行比 ...
- 使用 nodeJs 开发微信公众号(上传图片)
在给用户发送消息中涉及到的素材(图片.视频.音频.文章等)需要事先传到微信服务器,然后获得媒体id(media_id),然后把 media_id 传递给用户 上传分上传临时素材(只保存三天)和上传永久 ...
- pyqt5-----postgresql数据库使用
上一章解决了无法加载postgresql数据库的问题 1.打开数据from PyQt5 import QtWidgets,QtSql,QtCoreimport sys app =QtCore.QCor ...
- Java 非递归实现 二叉树的前中后遍历以及层级遍历
class MyBinaryTree<T> { BinaryNode<T> root; public MyBinaryTree() { root = new BinaryNod ...
- 一文让你秒懂互联网TCP/IP协议的深层含义
什么是 TCP/IP 协议 首先,协议,可以理解为是一套统一的规则,就像行业标准.由于互联网主要的功能是传输信息,所以其协议一般是管理系统之间如何相互通信的规则. 用邮政和物流等线下的“运输协议”来理 ...
- 记一次laravel远程关联查询
如图,一个服务(service)对应一个用户(user),一个用户对应多个标签(tag),同时一个tag也可以通过中间表(pivot)对应对个用户. 现在业务需求如下:查service,这些servi ...
- jdk-8u181-docs.chm -- 制作时间2018年8月12日
为了方便查阅,自己做了一个JDK8的chm文件:jdk-8u181-docs.chm 密码: g675 chm制作工具 :chmwriter 目录:
- Visual Studio 注释与取消注释快捷键
注释: 先CTRL+K,然后CTRL+C 取消注释: 先CTRL+K,然后CTRL+U
- del_cursor 批量删除游标
declare cursor [del_cursor] is select a.*, a.rowid row_id from [table_name] a order by a.rowid; ...