add dev readme

Author: Dewyzee

build/README.md

@@ -0,0 +1,26 @@
+
+
+> 项目组织与开发
+
+## 项目目录
+
+|—— assets // 项目静态资源
+|—— build
+|  ├── template // 快速创建目录模板
+|  ├── util // 构建公共方法
+|  ├── build-dev.js // 构建dev模式
+|  ├── build-prod.js // 构建产出模式
+|—— example // 示例目录
+|—— src
+|  ├── components 组件目录  
+|  ├── index.js // 入口文件
+|
+|—— ...
+
+## 组件开发说明
+
+* 通过``npm run create xxx``命令创建组件目录，目录模板在build下面。xxx是要创建的组件名
+
+* 组件目录中将vue文件与样式文件分离解偶，方便维护与拓展
+
+* examples目录下是mpvue项目，新开发的组件在这里进行调试验证

build/genTemplate.js

@@ -0,0 +1,53 @@
+const fs = require('fs')
+const path = require('path')
+const mkdirp = require('mkdirp')
+const argv = process.argv
+const cwd = process.cwd()
+let componentDirName = ''
+let destDir = ''
+
+function walkDir(dirPath) {
+  fs.readdir(dirPath, (err, files) => {
+    if (err) {
+      console.error(err)
+      return
+    }
+    files.forEach(filename => {
+      const fileDir = path.join(dirPath, filename)
+      fs.stat(fileDir, (error, stats) => {
+        if (error) {
+          console.error(error)
+          return
+        }
+        if (stats.isDirectory()) {
+          walkDir(fileDir)
+          return
+        }
+        let relativePath = path.relative(path.join(cwd, 'build', 'template'), fileDir)
+        let content = fs.readFileSync(fileDir, 'utf8')
+        if (path.extname(relativePath).match(/(\.vue|\.less)$/)) {
+          relativePath = relativePath.replace(/index/, argv[2])
+        }
+        else {
+          content = content.replace(/index/g, argv[2])
+        }
+        const fileDistPath = path.join(destDir, relativePath)
+        const dirname = path.dirname(fileDistPath)
+        mkdirp.sync(dirname)
+        fs.writeFileSync(fileDistPath, content, 'utf8')
+      })
+    })
+  })
+}
+
+if (argv && argv.length && argv[2]) {
+  componentDirName = argv[2]
+  destDir = path.join(cwd, 'src', 'components', componentDirName)
+  if (fs.existsSync(destDir)) {
+    throw Error('组件已经存在')
+  }
+  walkDir(path.join(cwd, 'build', 'template'))
+}
+else {
+  throw Error('组件名称未定义')
+}

build/template/index.js

@@ -0,0 +1,3 @@
+import index from 'index.vue'
+
+export default index

build/template/index.vue

@@ -0,0 +1,3 @@
+<template>
+  <div></div>
+</template>

build/template/style/index.js

@@ -0,0 +1 @@
+import './index.less'

build/template/style/index.less

@@ -0,0 +1,2 @@
+@import '../../common/_base.less';
+@import '../../common/_mixins.less';

examples/.babelrc

@@ -0,0 +1,18 @@
+{
+  "presets": [
+    ["env", {
+      "modules": false,
+      "targets": {
+        "browsers": ["> 1%", "last 2 versions", "not ie <= 8"]
+      }
+    }],
+    "stage-2"
+  ],
+  "plugins": ["transform-runtime"],
+  "env": {
+    "test": {
+      "presets": ["env", "stage-2"],
+      "plugins": ["istanbul"]
+    }
+  }
+}

examples/.editorconfig

@@ -0,0 +1,9 @@
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 2
+end_of_line = lf
+insert_final_newline = true
+trim_trailing_whitespace = true

examples/.postcssrc.js

@@ -0,0 +1,7 @@
+// https://github.com/michael-ciniawsky/postcss-load-config
+
+module.exports = {
+  "plugins": {
+    "postcss-mpvue-wxss": {}
+  }
+}

examples/README.md

@@ -0,0 +1,37 @@
+# examples
+
+> A Mpvue project
+
+## Build Setup
+
+``` bash
+# 初始化项目
+vue init mpvue/mpvue-quickstart myproject
+cd myproject
+
+# 安装依赖
+yarn
+
+# 开发时构建
+npm dev
+
+# 打包构建
+npm build
+
+# 指定平台的开发时构建(微信、百度、头条、支付宝)
+npm dev:wx
+npm dev:swan
+npm dev:tt
+npm dev:my
+
+# 指定平台的打包构建
+npm build:wx
+npm build:swan
+npm build:tt
+npm build:my
+
+# 生成 bundle 分析报告
+npm run build --report
+```
+
+For detailed explanation on how things work, checkout the [guide](http://vuejs-templates.github.io/webpack/) and [docs for vue-loader](http://vuejs.github.io/vue-loader).