wepy小程序框架初探

结合Min组件库

1. 安装MIn-cli
   npm install -g @mindev/min-cli
min -v 查看版本号 要求1.0.4以上

2. 安装 wepy-cli
   npm install wepy-cli -g

3. 初始化项目
   wepy init standard myprojec
cd myprojec

选择开启
1. sass
去掉wepy.config.js 里关于sass的注释
配置文件 package.json 加入
"wepy-compiler-sass": "^1.3.8"

2. Min组件库
根目录新建 min.config.json 配置文件
内容为
{
  "compilers": {
    "babel": {
      "sourceMaps": "inline",
      "presets": [
        "env"
      ],
      "plugins": [
        "syntax-export-extensions",
        "transform-class-properties",
        "transform-decorators-legacy",
        "transform-export-extensions"
      ]
    }
  }
}

安装某个组件
min install @minui/wxc-toast
默认路径
开启cs6转es5

4. 安装依赖
   npm install

5. 开启 async / await

constructor () {
    super()
    this.use('promisify')  // 加入这句
    this.use('requestfix')
  }

6. 开启实时编译
   一定要先安装Min某个组件再开启wepy*
wepy build --watch

遇到的坑!

1. 组件style、template、script的onLoad内必须有东西，不然会报错

<style lang="sass">
  .song-list
</style>
<template>
  <view class="song-list">111</view>
</template>
<script>
  ...
  onLoad () {
    console.log('song-list')
  }
  ...
</script>

2. style 里 如果加scoped

元素必须加class使用 ，不能使用标签名

3. v-if和 v-show 为 wx:if={{条件判断}}、wx:show{{true}}

4. :class 为 class="icon {{ 条件判断 ? 'active' : '' }}"

5. @click 为 @tap="selectItem( {{ item }}, {{ index}} ) "

6. 当使用mixins共享属性方法时，页面的某个组件使用了该方法，如果mixins里使用了watch、computed，那么该页面里 不能有watch、computed