About
当我们最初创建一个Vue项目后,我们会根据项目需要以及个人的一些习惯安装一些依赖包或者插件,这篇文章主要写的是我最近写的一个移动端网页的项目创建的过程。
一、创建项目
- 先在github等代码托管网站上建立一个仓库
- 将仓库克隆到本地
git clone git@github.com:gitBingxu/travel.git
- 使用vue-cli脚手架初始化项目
vue-cli init webpack project-name
- 完成上述操作后,可以试着跑一下项目,看是否初始化成功
cd project-name
npm run start
如果上述操作都完成了,那么我们的项目也就创建成功了
二、引入第三方包
- 配置
meta
标签,在index.htm的meta
中添加如下内容,这样可以禁止用户缩放页面
content="width=device-width,initial-scale=1.0,
minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"
- 引入
reset.css
,解决在不同设备上的兼容性问题。 - 引入
border.css
,解决在二倍屏或者三倍屏中1px边框显示不正常问题。
这两个css文件可以从我的github仓库中获取
https://github.com/gitBingxu/travel/tree/master/src/assets/styles
- 安装fastclick解决移动端设备300ms点击延迟的问题
1. npm install fastclick --save
2. fastClick.attach(document.body) // 在main.js添加这行代码
- 还可以根据自己的喜好添加一些其他的包比如 vue-awesome-swiper、velocity.js 等一些其他的插件。
三、配置VsCode模板
参照我的另一篇博客: https://www.jianshu.com/p/44a7022a301b
结尾
通过上述操作,一个简单的项目也就创建成功了。
网友评论