[new feature] add i18n support (#310)

* fix: Tabbar icon line-height

* [new feature] progress add showPivot prop

* [new feature] TabItem support vue-router

* [new feature] update document header style

* [Doc] add toast english ducoment

* [new feature] add i18n support

* feat: Extract demos from markdown

* feat: Base components demos

* [new feature] complete demo extract & translate

* [fix] text cases

* fix: add deepAssign test cases

* fix: changelog detail

* [new feature] AddressEdit support i18n

build/bin/build-entry.js

@@ -1,28 +1,37 @@
-var Components = require('./get-components')();
-var fs = require('fs');
-var render = require('json-templater/string');
-var uppercamelcase = require('uppercamelcase');
-var path = require('path');
+const Components = require('./get-components')();
+const fs = require('fs');
+const path = require('path');
+const uppercamelize = require('uppercamelcase');
+const version = process.env.VERSION || require('../../package.json').version;
+const tips = '// This file is auto gererated by build/bin/build-entry.js';
 
-var OUTPUT_PATH = path.join(__dirname, '../../packages/index.js');
-var IMPORT_TEMPLATE = 'import {{name}} from \'./{{package}}\';';
-var ISNTALL_COMPONENT_TEMPLATE = '  {{name}}';
-var MAIN_TEMPLATE = `{{include}}
+function buildVantEntry() {
+  const uninstallComponents = [
+    'Lazyload',
+    'Waterfall',
+    'Dialog',
+    'Toast',
+    'ImagePreview',
+    'Locale'
+  ];
 
-const version = '{{version}}';
+  const importList = Components.map(name => `import ${uppercamelize(name)} from './${name}';`);
+  const exportList = Components.map(name => `${uppercamelize(name)}`);
+  const intallList = exportList.filter(name => !~uninstallComponents.indexOf(uppercamelize(name)));
+  const content = `${tips}
+${importList.join('\n')}
+
+const version = '${version}';
 const components = [
-{{components}}
+  ${intallList.join(',\n  ')}
 ];
 
-const install = function(Vue) {
-  if (install.installed) return;
-
+const install = Vue => {
   components.forEach(component => {
     Vue.component(component.name, component);
   });
 };
 
-/* istanbul ignore if */
 if (typeof window !== 'undefined' && window.Vue) {
   install(window.Vue);
 }
@@ -30,54 +39,72 @@ if (typeof window !== 'undefined' && window.Vue) {
 export {
   install,
   version,
-{{list}}
+  ${exportList.join(',\n  ')}
 };
+
 export default {
   install,
   version
 };
 `;
 
-delete Components.font;
+  fs.writeFileSync(path.join(__dirname, '../../packages/index.js'), content);
+}
 
-var includeComponentTemplate = [];
-var installTemplate = [];
-var listTemplate = [];
+function buildDemoEntry() {
+  const dir = path.join(__dirname, '../../docs/demos/views');
+  const demos = fs.readdirSync(dir)
+    .filter(name => ~name.indexOf('.vue'))
+    .map(name => name.replace('.vue', ''))
+    .map(name => `'${name}': r => require.ensure([], () => r(wrapper(require('./views/${name}'), '${name}')), '${name}')`);
 
-Components.forEach(name => {
-  var componentName = uppercamelcase(name);
+  const content = `${tips}
+import './common';
 
-  includeComponentTemplate.push(render(IMPORT_TEMPLATE, {
-    name: componentName,
-    package: name
-  }));
+function wrapper(component, name) {
+  component = component.default;
+  component.name = 'demo-' + name;
+  return component;
+}
 
-  if ([
-    // directives
-    'Lazyload',
-    'Waterfall',
+export default {
+  ${demos.join(',\n  ')}
+};
+`;
+  fs.writeFileSync(path.join(dir, '../index.js'), content);
+}
 
-    // services
-    'Dialog',
-    'Toast',
-    'ImagePreview'
-  ].indexOf(componentName) === -1) {
-    installTemplate.push(render(ISNTALL_COMPONENT_TEMPLATE, {
-      name: componentName,
-      component: name
-    }));
-  }
+function buildDocsEntry() {
+  const dir = path.join(__dirname, '../../docs/markdown');
+  const cnDocs = fs.readdirSync(path.join(dir, 'zh-CN')).map(name => 'zh-CN/' + name);
+  const enDocs = fs.readdirSync(path.join(dir, 'en-US')).map(name => 'en-US/' + name);
+  const docs = [...cnDocs, ...enDocs]
+    .filter(name => name.indexOf('.md') !== -1)
+    .map(name => name.replace('.md', ''))
+    .map(name => `'${name}': wrapper(r => require.ensure([], () => r(require('./${name}.md')), '${name}'))`);
 
-  listTemplate.push(`  ${componentName}`);
-});
+  const content = `${tips}
+import progress from 'nprogress';
+import 'nprogress/nprogress.css';
 
-var template = render(MAIN_TEMPLATE, {
-  include: includeComponentTemplate.join('\n'),
-  list: listTemplate.join(',\n'),
-  components: installTemplate.join(',\n') || ' ',
-  version: process.env.VERSION || require('../../package.json').version
-});
+function wrapper(component) {
+  return function(r) {
+    progress.start();
+    component(r).then(() => {
+      progress.done();
+    }).catch(() => {
+      progress.done();
+    });
+  };
+}
 
-fs.writeFileSync(OUTPUT_PATH, template);
-console.log('[build entry] DONE:' + OUTPUT_PATH);
+export default {
+  ${docs.join(',\n  ')}
+};
+`;
+  fs.writeFileSync(path.join(dir, './index.js'), content);
+}
 
+buildVantEntry();
+buildDemoEntry();
+buildDocsEntry();

build/webpack.config.dev.js

@@ -6,20 +6,11 @@ const ProgressBarPlugin = require('progress-bar-webpack-plugin');
 const FriendlyErrorsPlugin = require('friendly-errors-webpack-plugin');
 const isProduction = process.env.NODE_ENV === 'production';
 const docConfig = require('../docs/src/doc.config');
-const { extractExample } = require('zan-doc/src/helper');
 const styleLoaders = [
   { loader: 'css-loader' },
   { loader: 'postcss-loader', options: { sourceMap: true } }
 ];
 
-// extract [components].vue from [components].md
-extractExample({
-  src: path.resolve(__dirname, '../docs/examples-docs'),
-  dist: path.resolve(__dirname, '../docs/examples-dist'),
-  nav: docConfig,
-  watch: !isProduction
-});
-
 module.exports = {
   entry: {
     vendor: ['packages'],
@@ -89,15 +80,7 @@ module.exports = {
         test: /\.md/,
         loader: 'vue-markdown-loader',
         options: {
-          preventExtract: true,
-          use: [[require('markdown-it-container'), 'demo']],
-          preprocess(MarkdownIt, source) {
-            const styleRegexp = /<style\b[^<]*(?:(?!<\/style>)<[^<]*)*<\/style>/i;
-            const scriptRegexp = /<script\b[^<]*(?:(?!<\/script>)<[^<]*)*<\/script>/i;
-            MarkdownIt.renderer.rules.table_open = () =>
-              '<table class="zan-doc-table">';
-            return source.replace(styleRegexp, '').replace(scriptRegexp, '');
-          }
+          preventExtract: true
         }
       },
       {