1、移动端使用切换2x 3x图
2、自动打包components下方的.vue组件
创建一个js文件,然后在main.js中 import 引用这个文件
这样当我们在components创建.vue文件时,所有文件就会被自动打包,这样我们就可以直接进行引用。
比如在components文件夹中创建一个component1.vue的组件 然后在HelloWorld.vue文件中进行引用就可以这样写了。
<component1></component1>
这样我们避免了每次都先import,然后声明components的繁琐步骤。
最后声明一个问题,这种方式就适合打包全局的公用组件,如果有其他个性化的组件还是要单独的写在一个文件夹中,自行引入!!!!
3、实现一个横向滚动并且没有滚动条的nav
4、移动端允许页面滑动和禁止页面滑动
5、待定
6、微信授权获取code
获取的code值将会拼到重定向url上,写个方法将code值提取出来就好
7、微信分享
引入weixin-js-sdk import wx from 'weixin-js-sdk'
npm上weixin-js-sdk是1.3.3版本,如升级到1.4版本 updateAppMessageShareData(分享给微信好友) updateTimelineShareData(分享到微信朋友圈)
下方分享给微信好友、分享到朋友圈的接口将替换成上方的接口。但是!1.4版本的接口我没跑通,哪位有幸看到,并且跑通了,求教。
8、使用vue-lazyload
首先npm安装vue-lazyload,去npm找一下就ok
引入 vue-lazyload -----> import VueLazyLoad from 'vue-lazyload'
使用 vue-lazyload -----> Vue.use(VueLazyLoad,{listenEvents:['scroll'], attemp:2, preload:1.3})
上述属性 npm上有更详细的描述 根据自己需求进行相应设置即可
最后只需在图片上将src替换成v-lazy即可,data中图片一定要用require引入
9、实际开发当中可以用:https://tinypng.com 来压缩图片,效果较好
10、vue 使用 lazyload动态加载图片的时候图片没有切换,加上:key就可以了
11、vue-cli 通过webpack切换 开发、测试、线上环境
(1)首先安装cross-env,这个工具主要是用来进行跨平台配置变量 支持windows Linux系统等多个平台
(2)修改config/dev.env.js中的代码
(3)修改config/prod.env.js中的代码
(4)接下来就是配置package.json文件,前边安装的cross-env在这里就用上了
这里配置的是3个环境,分别为开发环境、测试环境、正式环境。npm run dev 与 npm run dev-test是一样的效果
12、postmessage跨域请求