Redux Support

packages/wepy-cli/src/compile-script.js

@@ -128,6 +128,7 @@ export default {
     },
 
     npmHack (filename, code) {
+        code = code.replace(/process\.env\.NODE_ENV/g, JSON.stringify(process.env.NODE_ENV));
         switch(filename) {
             case 'lodash.js':
             case '_global.js':
@@ -141,6 +142,8 @@ export default {
                 // IOS 1.10.2 Promise BUG
                 code = code.replace('Promise && Promise.resolve', 'false && Promise && Promise.resolve');
                 break;
+            case '_freeGlobal.js':
+                code = code.replace('module.exports = freeGlobal;', 'module.exports = freeGlobal || this;')
         }
         return code;
     },
@@ -172,20 +175,19 @@ export default {
             }
             if (type !== 'npm') {
                 if (type === 'page' || type === 'app') {
-                    let defaultExport = 'exports.default';
-                    let matchs = code.match(/exports\.default\s*=\s*(\w+);/i);
-                    if (matchs) {
-                        defaultExport = matchs[1];
-                        code = code.replace(/exports\.default\s*=\s*(\w+);/i, '');
+                    code = code.replace(/exports\.default\s*=\s*(\w+);/ig, function (m, defaultExport) {
+                        if (defaultExport === 'undefined') {
+                            return '';
+                        }
 
                         if (type === 'page') {
                             let pagePath = path.join(path.relative(appPath.dir, opath.dir), opath.name).replace(/\\/ig, '/');
-                            code += `\nPage(require('wepy').default.$createPage(${defaultExport} , '${pagePath}'));\n`;
+                            return `\nPage(require('wepy').default.$createPage(${defaultExport} , '${pagePath}'));\n`;
                         } else {
                             appPath = opath;
-                            code += `\nApp(require('wepy').default.$createApp(${defaultExport}));\n`;
+                            return `\nApp(require('wepy').default.$createApp(${defaultExport}));\n`;
                         }
-                    }
+                    });
                 }
             }
 

packages/wepy-cli/src/compile-template.js

@@ -113,7 +113,7 @@ export default {
             return matchs.replace(/[^\.\w'"]([a-z_\$][\w\d\._\$]*)/ig, (match, word, n) => {
                 //console.log(matchs + '------' + match + '--' + word + '--' + n);
                 let char = match[0];
-                let tmp = word.match(/^(\w+)(.*)/);
+                let tmp = word.match(/^([\w$]+)(.*)/);
                 let w = tmp[1];
                 let rest = tmp[2];
                 if (ignores[w] || this.isInQuote(matchs, n)) {

packages/wepy-cli/src/util.js

@@ -353,8 +353,8 @@ const utils = {
             dir = opath.dir.replace('node_modules', `${dist}${path.sep}npm`) + path.sep;
         } else {
             let currentPath = path.relative(this.currentDir + path.sep + src, opath.dir);
-            dir = path.join(this.currentDir, dist, currentPath);
-            //dir = (opath.dir + path.sep).replace(path.sep + src + path.sep, path.sep + dist + path.sep);
+            dir = path.join(this.currentDir, dist, currentPath, path.sep);
+            // dir = (opath.dir + path.sep).replace(path.sep + src + path.sep, path.sep + dist + path.sep);
         }
         return dir + opath.name + ext;
     },

packages/wepy-cli/src/wepy.js

@@ -44,6 +44,8 @@ let generateProject = (name, config) => {
 
     let template = config.empty ? emptyDir : templateDir;
 
+    const useRedux = !config.empty && config.redux;
+
     let pkg = path.join(template, 'package.json');
     pkg = util.readFile(pkg);
     pkg = JSON.parse(pkg);
@@ -54,6 +56,7 @@ let generateProject = (name, config) => {
     ];
     const devDependencies = [
         'wepy-compiler-babel',
+        'babel-plugin-transform-decorators-legacy',
         'babel-plugin-syntax-export-extensions',
         'babel-plugin-transform-export-extensions',
         'babel-preset-es2015',
@@ -67,15 +70,24 @@ let generateProject = (name, config) => {
         'eslint-config-standard@7.1.0',
         'eslint-friendly-formatter@2.0.7',
         'eslint-plugin-html@2.0.1',
-        'eslint-plugin-promise@2.0.1',
+        'eslint-plugin-promise@3.5.0',
         'eslint-plugin-standard@2.0.1',
         'wepy-eslint'
     ];
+    const reduxDeps = [
+        'redux',
+        'wepy-redux',
+        'redux-promise',
+        'redux-actions'
+    ];
 
     if (!config.empty) {
         dependencies.push('wepy-com-toast');
         dependencies.push('wepy-async-function');
     }
+    if (useRedux) {
+        dependencies.push.apply(dependencies, reduxDeps);
+    }
 
     if (config.lint) {
         devDependencies.push.apply(devDependencies, eslintDeps);
@@ -94,6 +106,21 @@ let generateProject = (name, config) => {
             // --on-lint will not copy eslint config
             if (['.editorconfig', '.eslintignore', '.eslintrc'].indexOf(file) !== -1 && !config.lint)
                 return;
+            // 只有 redux 的项目拷贝 redux 相关内容 且做替换
+            const unReduxFiles = ['src/app.wpy', 'src/components/counter.wpy'];
+            const reduxFiles = ['src/app-redux.wpy', 'src/components/counter-redux.wpy'];
+            const index = reduxFiles.indexOf(file);
+            if (useRedux) {
+                if (unReduxFiles.indexOf(file) !== -1) {
+                    return;
+                }
+                // 将 reduxFiles 的文件重新命名
+                if (index >= 0) {
+                    target = path.join(util.currentDir, unReduxFiles[index]);
+                }
+            } else if (index !== -1 || file.indexOf('src/store/') === 0) {
+                return;
+            }
             if (file === 'wepy.config.js') {
                 if (!config.lint) {
                     // 去掉 eslint: true,
@@ -221,6 +248,7 @@ commander.option('-f, --file <file>', '待编译wpy文件');
 commander.option('--no-cache', '对于引用到的文件，即使无改动也会再次编译');
 commander.option('--empty', '使用new生成项目时，生成空项目内容');
 commander.option('--no-lint', '使用new生成项目时，禁用eslint');
+commander.option('--redux', '使用new生成项目时，增加redux相关内容');
 commander.option('-w, --watch', '监听文件改动');
 
 commander.command('build').description('编译项目').action(projectPath => {

packages/wepy-cli/templates/template/src/app-redux.wpy

@@ -0,0 +1,73 @@
+<style lang="less">
+.container {
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: space-between;
+  box-sizing: border-box;
+}
+</style>
+
+<script>
+import wepy from 'wepy'
+import 'wepy-async-function'
+import { setStore } from 'wepy-redux'
+import configStore from './store'
+
+const store = configStore()
+setStore(store)
+
+export default class extends wepy.app {
+  config = {
+    pages: [
+      'pages/index'
+    ],
+    window: {
+      backgroundTextStyle: 'light',
+      navigationBarBackgroundColor: '#fff',
+      navigationBarTitleText: 'WeChat',
+      navigationBarTextStyle: 'black'
+    }
+  }
+
+  globalData = {
+    userInfo: null
+  }
+
+  constructor () {
+    super()
+    this.use('requestfix')
+  }
+
+  onLaunch() {
+    this.testAsync()
+  }
+
+  sleep (s) {
+    return new Promise((resolve, reject) => {
+      setTimeout(() => {
+        resolve('promise resolved')
+      }, s * 1000)
+    })
+  }
+
+  async testAsync () {
+    const data = await this.sleep(3)
+    console.log(data)
+  }
+
+  getUserInfo(cb) {
+    const that = this
+    if (this.globalData.userInfo) {
+      return this.globalData.userInfo
+    }
+    wepy.getUserInfo({
+      success (res) {
+        that.globalData.userInfo = res.userInfo
+        cb && cb(res.userInfo)
+      }
+    })
+  }
+}
+</script>

packages/wepy-cli/templates/template/src/components/counter-redux.wpy

@@ -0,0 +1,74 @@
+<style lang="less">
+  .counter {
+    text-align: left;
+    font-size: 12px;
+  }
+  .count {
+    font-size: 18px;
+    font-weight: bold;
+  }
+</style>
+<template>
+  <view class="counter {{style}}">
+    <button @tap="plus" size="mini">  +  </button>
+    <button @tap="minus" size="mini">  -  </button>
+    <button @tap="incNum" size="mini">  INCREMENT  </button>
+    <button @tap="decNum" size="mini">  DECREMENT  </button>
+    <button @tap="asyncInc" size="mini">  ASYNC INCREMENT  </button>
+    <text class="count"> {{num}} </text>
+    <text class="count"> {{stateNum}} </text>
+    <text class="count"> {{asyncNum}} </text>
+  </view>
+</template>
+<script>
+  import wepy from 'wepy'
+  import { connect } from 'wepy-redux'
+  import { INCREMENT, DECREMENT } from '../store/types/counter'
+  import { asyncInc } from '../store/actions'
+
+  @connect({
+    stateNum (state) {
+      return state.counter.num
+    },
+    asyncNum (state) {
+      return state.counter.asyncNum
+    }
+  }, {
+    incNum: INCREMENT,
+    decNum: DECREMENT,
+    asyncInc
+  })
+  export default class Counter extends wepy.component {
+    props = {
+      num: {
+        type: [Number, String],
+        coerce: function (v) {
+          return +v
+        },
+        default: 50
+      }
+    }
+
+    data = {
+    }
+    events = {
+      'index-broadcast': (...args) => {
+        let $event = args[args.length - 1]
+        console.log(`${this.$name} receive ${$event.name} from ${$event.source.$name}`)
+      }
+    }
+
+    methods = {
+      plus () {
+        this.num = this.num + 1
+        console.log(this.$name + ' plus tap')
+
+        this.$emit('index-emit', 1, 2, 3)
+      },
+      minus () {
+        this.num = this.num - 1
+        console.log(this.$name + ' minus tap')
+      }
+    }
+  }
+</script>

packages/wepy-cli/templates/template/src/store/actions/counter.js

@@ -0,0 +1,10 @@
+import { ASYNC_INCREMENT } from '../types/counter'
+import { createAction } from 'redux-actions'
+
+export const asyncInc = createAction(ASYNC_INCREMENT, () => {
+  return new Promise(resolve => {
+    setTimeout(() => {
+      resolve(1)
+    }, 1000)
+  })
+})

packages/wepy-cli/templates/template/src/store/actions/index.js

@@ -0,0 +1 @@
+export * from './counter'

packages/wepy-cli/templates/template/src/store/index.js

@@ -0,0 +1,8 @@
+import { createStore, applyMiddleware } from 'redux'
+import promiseMiddleware from 'redux-promise'
+import rootReducer from './reducers'
+
+export default function configStore () {
+  const store = createStore(rootReducer, applyMiddleware(promiseMiddleware))
+  return store
+}

packages/wepy-cli/templates/template/src/store/reducers/counter.js

@@ -0,0 +1,27 @@
+import { INCREMENT, DECREMENT, ASYNC_INCREMENT } from '../types/counter'
+
+function counter (state = {num: 0, asyncNum: 0}, action) {
+  switch (action.type) {
+    case INCREMENT:
+      return {
+        ...state,
+        num: state.num + 1
+      }
+    case DECREMENT:
+      return {
+        ...state,
+        num: state.num - 1
+      }
+    case ASYNC_INCREMENT:
+      return {
+        ...state,
+        asyncNum: state.asyncNum + action.payload
+      }
+    default:
+      return {
+        ...state
+      }
+  }
+}
+
+export default counter

packages/wepy-cli/templates/template/src/store/reducers/index.js

@@ -0,0 +1,6 @@
+import { combineReducers } from 'redux'
+import counter from './counter'
+
+export default combineReducers({
+  counter
+})

packages/wepy-cli/templates/template/src/store/types/counter.js

@@ -0,0 +1,5 @@
+export const INCREMENT = 'INCREMENT'
+
+export const DECREMENT = 'DECREMENT'
+
+export const ASYNC_INCREMENT = 'ASYNC_INCREMENT'

packages/wepy-cli/templates/template/src/store/types/index.js

@@ -0,0 +1 @@
+export * from './counter'

packages/wepy-cli/templates/template/wepy.config.js

@@ -17,6 +17,7 @@ module.exports = {
         'stage-1'
       ],
       plugins: [
+        'transform-decorators-legacy',
         'transform-export-extensions',
         'syntax-export-extensions'
       ]