使用wepy开发小程序总结

发表于   |  

使用wepy开发小程序效率提升了很多，相比使用小程序原生框架开发，开发体验提升了好几个等级。如果是从Vue过来的，可能会对wepy部分语法不熟悉，导致自己掉进想当然(Vue习惯的写法)的坑里，所以还是要熟读wepy的文档，理解一些新的概念。我个人觉得wepy是类Vue。mpvue跟Vue更加亲一些。当然还是要感谢作者@Gcaufy提供这么好的框架，这也是为何个人项目会收入到公司项目的原因吧。

WePY 是一款让小程序支持组件化开发的框架，通过预编译的手段让开发者可以选择自己喜欢的开发风格去开发小程序。框架的细节优化，Promise，Async Functions的引入都是为了能让开发小程序项目变得更加简单，高效。

环境配置

1
2
3
4
$ npm install wepy-cli -g
$ wepy init standard
$ npm install
$ wepy build --watch

使用微信开发者工具导入项目，关闭ES6 转 ES5

问题

微信小程序 button 去除 border

wepy-plugin-image

无法转换
// function createDemoComponents(prefix, component, lenght) {
// const components = {}
// for (let i = 0; i < lenght; i++) {
// const key = prefix + i
// components[key] = component
// }
// return components
// }

// const demoComponents = createDemoComponents(‘btn’, DoButton, 10)
// console.log(demoComponents)

// 组件无效

1:1 error Resolve error: plugins.forEach is not a function import/no-unresolved
1:1 error Resolve error: plugins.forEach is not a function import/no-extraneous-dependencies
1:1 error Resolve error: plugins.forEach is not a function import/no-duplicates
1:1 error Resolve error: plugins.forEach is not a function import/extensions
1:1 error Resolve error: plugins.forEach is not a function import/no-named-as-default
1:1 error Resolve error: plugins.forEach is not a function import/no-named-as-default-member
1:19 error Unable to resolve path to module ‘utils/service’ import/no-unresolved

repeat
不支持添加 @tap

wepy input 数据绑定

less import 路径 alias
https://www.google.com/search?q=wepy+less+import&oq=wepy+less+import&aqs=chrome..69i57.628j0j4&sourceid=chrome&ie=UTF-8

  1. 小程序 media 支持
  2. image mode background-size
  3. wepy 图片上传资源服务器
  4. base64支持
  5. twoWay: true ？双向绑定？

小程序 canvas如何隐藏 display: none; 可行

周边工具

dowe

vue2mina

labrador

资源

参考文档