You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@echarts.apache.org by sh...@apache.org on 2020/01/02 12:30:15 UTC
[incubator-echarts-doc] branch release updated: optimize dev
process. fix mobile experience
This is an automated email from the ASF dual-hosted git repository.
shenyi pushed a commit to branch release
in repository https://gitbox.apache.org/repos/asf/incubator-echarts-doc.git
The following commit(s) were added to refs/heads/release by this push:
new 90308c1 optimize dev process. fix mobile experience
90308c1 is described below
commit 90308c1b4b9eb2de397b18edbe60f6f70f077b2c
Author: pissang <bm...@gmail.com>
AuthorDate: Thu Jan 2 20:29:54 2020 +0800
optimize dev process. fix mobile experience
1. add watch mode in build.js. improve rebuild speed
2. copy assets into incubator-echarts-website
3. fix style on mobile when displayed in incubator-echarts-website
4. update element ui to 2.13.0 to fix drawer issue when chalk theme is not included.
---
build.js | 164 ++++++++++++++++++--------------
build/webpack.config.js | 1 +
config/env.dev.js | 2 +-
package.json | 2 +-
src/AppMobile.vue | 23 +++--
src/components/DocContent.vue | 3 +-
src/components/SearchResult.vue | 6 ++
src/components/SearchResultItemCard.vue | 6 ++
watch.js | 85 -----------------
9 files changed, 123 insertions(+), 169 deletions(-)
diff --git a/build.js b/build.js
index 84440c0..8c81553 100644
--- a/build.js
+++ b/build.js
@@ -22,12 +22,14 @@ const chalk = require('chalk');
const argv = require('yargs').argv;
const path = require('path');
const assert = require('assert');
+const chokidar = require('chokidar');
+const debounce = require('lodash.debounce');
const projectDir = __dirname;
function initEnv() {
let envType = argv.env;
- let isDev = argv.dev != null || argv.debug != null || envType === 'debug';
+ let isDev = argv.dev != null || argv.debug != null || argv.env === 'dev';
if (isDev) {
console.warn('=============================');
@@ -61,84 +63,115 @@ for (let key in config) {
}
async function md2jsonAsync(opt) {
- return await new Promise((resolve, reject) => {
- md2json(opt, schema => {
- resolve(schema);
+ var newOpt = Object.assign({
+ path: path.join(opt.language, opt.entry, '**/*.md'),
+ tplEnv: config,
+ imageRoot: config.imagePath
+ }, opt);
+
+ function run(cb) {
+ md2json(newOpt, schema => {
+ writeSingleSchema(schema, opt.language, opt.entry, false);
+ writeSingleSchemaPartioned(schema, opt.language, opt.entry, false);
+ console.log(chalk.green('generated: ' + opt.language + '/' + opt.entry));
+ cb && cb();
});
+ }
+
+ var runDebounced = debounce(run, 500, {
+ leading: false,
+ trailing: true
+ });
+ return await new Promise((resolve, reject) => {
+ run(resolve);
+
+ if (argv.watch) {
+ chokidar.watch(path.resolve(__dirname, opt.language, opt.entry), {
+ ignoreInitial: true
+ }).on('all', (event, path) => {
+ console.log(path, event);
+ runDebounced();
+ });
+ }
});
}
+function copyAsset() {
+
+ const assetSrcDir = path.resolve(projectDir, 'asset');
+
+ function doCopy() {
+ for (let lang of languages) {
+ const assetDestDir = path.resolve(config.releaseDestDir, `${lang}/documents/asset`);
+ copydir.sync(assetSrcDir, assetDestDir);
+ }
+ }
+ var doCopyDebounced = debounce(doCopy, 500, {
+ leading: false,
+ trailing: true
+ });
+
+ doCopy();
+
+ if (argv.watch) {
+ chokidar.watch(assetSrcDir, {
+ ignoreInitial: true
+ }).on('all', (event, path) => {
+ console.log(path, event);
+ doCopyDebounced();
+ });
+ }
+ console.log('Copy asset done.');
+}
+
async function run() {
for (let language of languages) {
- let schema;
-
- schema = await md2jsonAsync({
- path: language + '/option/**/*.md',
+ await md2jsonAsync({
sectionsAnyOf: ['visualMap', 'dataZoom', 'series', 'graphic.elements'],
entry: 'option',
- tplEnv: config,
- imageRoot: config.imagePath
+ language
});
- // Always print single option.html file for some third part usage (e.g., dataV).
- writeSingleSchema(schema, language, 'option', false);
- writeSingleSchemaPartioned(schema, language, 'option', false);
- schema = await md2jsonAsync({
- path: language + '/tutorial/**/*.md',
+ await md2jsonAsync({
entry: 'tutorial',
- tplEnv: config,
maxDepth: 1,
- imageRoot: config.imagePath
+ language
});
- writeSingleSchema(schema, language, 'tutorial');
- writeSingleSchemaPartioned(schema, language, 'tutorial', false);
- schema = await md2jsonAsync({
- path: language + '/api/**/*.md',
+ await md2jsonAsync({
entry: 'api',
- tplEnv: config,
- imageRoot: config.imagePath
+ language
});
- writeSingleSchema(schema, language, 'api');
- writeSingleSchemaPartioned(schema, language, 'api', false);
- schema = await md2jsonAsync({
- path: language + '/option-gl/**/*.md',
+ await md2jsonAsync({
sectionsAnyOf: ['series'],
entry: 'option-gl',
+ // Overwrite
tplEnv: config.gl,
- imageRoot: config.gl.imagePath
+ imageRoot: config.gl.imagePath,
+ language
});
- writeSingleSchema(schema, language, 'option-gl');
- writeSingleSchemaPartioned(schema, language, 'option-gl', false);
-
-
-
- // let plainMarkDownTpl = fs.readFileSync('tool/plain-md.tpl', 'utf-8');
- // let codingStandardMD = fs.readFileSync('en' + '/coding-standard.md', 'utf-8');
- // let codingStandardContent = marked(codingStandardMD);
- // let codingStandardTOC = marked(codingStandardMD, {renderer: new MarkDownTOCRenderer()});
- // fse.outputFileSync(
- // 'public/' + language + '/documents/' + language + '/coding-standard.html',
- // plainMarkDownTpl
- // .replace('{{toc}}', codingStandardTOC)
- // .replace('{{content}}', codingStandardContent),
- // 'utf-8'
- // );
}
console.log('Build doc done.');
- buildChangelog();
-
- buildCodeStandard();
-
copyAsset();
- copySite();
-
- // copyBlog();
+ if (!argv.watch) { // Not in watch dev mode
+ try {
+ // TODO Do we need to debug changelog in the doc folder?
+ buildChangelog();
+ buildCodeStandard();
+
+ copySite();
+ }
+ catch (e) {
+ console.log('Error happens when copying to dest folders.');
+ console.log(e);
+ }
+ // copyBlog();
+ }
console.log('All done.');
}
@@ -170,29 +203,16 @@ function buildCodeStandard() {
console.log('Build code standard done.');
}
-function copyAsset() {
- for (let lang of languages) {
- const assetSrcDir = path.resolve(projectDir, 'asset');
- const assetDestDir = path.resolve(config.releaseDestDir, `${lang}/documents/asset`);
- copydir.sync(assetSrcDir, assetDestDir);
- }
- console.log('Copy asset done.');
-}
-
function copySite() {
- // `npm run build:site` have generated the boundle files to `public/`
- if (config.envType === 'dev') {
- return;
- }
+ const jsSrcPath = path.resolve(projectDir, 'public/js/doc-bundle.js');
+ const cssSrcDir = path.resolve(projectDir, 'public/css');
// Copy js and css of doc site.
for (let lang of languages) {
- const jsSrcPath = path.resolve(projectDir, 'public/js/doc-bundle.js')
const jsDestPath = path.resolve(config.releaseDestDir, `${lang}/js/doc-bundle.js`);
fse.copySync(jsSrcPath, jsDestPath);
console.log(chalk.green(`js copied to: ${jsDestPath}`));
- const cssSrcDir = path.resolve(projectDir, 'public/css');
const cssDestDir = path.resolve(config.releaseDestDir, `${lang}/css`);
fse.copySync(cssSrcDir, cssDestDir);
console.log(chalk.green(`css copied to: ${cssDestDir}`));
@@ -210,31 +230,31 @@ function copyBlog() {
}
function writeSingleSchema(schema, language, docName, format) {
- const destPath = path.resolve(config.releaseDestDir, `${language}/documents/${docName}.json`);
+ const destPath = path.resolve(__dirname, `public/${language}/documents/${docName}.json`);
fse.ensureDirSync(path.dirname(destPath));
fse.outputFileSync(
destPath,
format ? JSON.stringify(schema, null, 2) : JSON.stringify(schema),
'utf-8'
);
- console.log(chalk.green('generated: ' + destPath));
+ // console.log(chalk.green('generated: ' + destPath));
}
function writeSingleSchemaPartioned(schema, language, docName, format) {
const {outline, descriptions} = extractDesc(schema, docName);
- const outlineDestPath = path.resolve(config.releaseDestDir, `${language}/documents/${docName}-parts/${docName}-outline.json`);
+ const outlineDestPath = path.resolve(__dirname, `public/${language}/documents/${docName}-parts/${docName}-outline.json`);
fse.ensureDirSync(path.dirname(outlineDestPath));
fse.outputFile(
outlineDestPath,
format ? JSON.stringify(outline, null, 2) : JSON.stringify(outline),
'utf-8'
);
- console.log(chalk.green('generated: ' + outlineDestPath));
+ // console.log(chalk.green('generated: ' + outlineDestPath));
for (let partKey in descriptions) {
let partDescriptions = descriptions[partKey];
- let descDestPath = path.resolve(config.releaseDestDir, `${language}/documents/${docName}-parts/${partKey}.json`);
+ let descDestPath = path.resolve(__dirname, `public/${language}/documents/${docName}-parts/${partKey}.json`);
fse.ensureDirSync(path.dirname(descDestPath));
fse.outputFile(
descDestPath,
@@ -242,7 +262,7 @@ function writeSingleSchemaPartioned(schema, language, docName, format) {
JSON.stringify(partDescriptions, null, 2),
'utf-8'
);
- console.log(chalk.green('generated: ' + descDestPath));
+ // console.log(chalk.green('generated: ' + descDestPath));
}
};
diff --git a/build/webpack.config.js b/build/webpack.config.js
index a8ca380..45f7232 100644
--- a/build/webpack.config.js
+++ b/build/webpack.config.js
@@ -12,6 +12,7 @@ module.exports = {
library: 'echartsDoc',
libraryTarget: 'umd'
},
+ stats: 'minimal',
module: {
rules: [{
test: /\.vue$/,
diff --git a/config/env.dev.js b/config/env.dev.js
index 74bc11d..fd043bd 100644
--- a/config/env.dev.js
+++ b/config/env.dev.js
@@ -10,6 +10,6 @@ module.exports = {
imagePath: 'asset/gl/img/'
},
- releaseDestDir: path.resolve(__dirname, '../public'),
+ releaseDestDir: path.resolve(__dirname, '../../incubator-echarts-website'),
ecWWWGeneratedDir: path.resolve(__dirname, '../../echarts-www/_generated')
};
\ No newline at end of file
diff --git a/package.json b/package.json
index b6d88df..17898f3 100644
--- a/package.json
+++ b/package.json
@@ -8,7 +8,7 @@
},
"scripts": {
"build": "node build.js --env asf",
- "watch": "node build.js --env dev && node watch.js --env dev",
+ "watch": "node build.js --env dev --watch",
"build:site": "npx webpack --config build/webpack.config.js --mode production",
"watch:site": "npx webpack --config build/webpack.config.js --mode development --devtool sourcemap --watch",
"server": "node server.js",
diff --git a/src/AppMobile.vue b/src/AppMobile.vue
index 103d2d8..84b0f16 100644
--- a/src/AppMobile.vue
+++ b/src/AppMobile.vue
@@ -14,6 +14,10 @@
:href="'tutorial.html'"
:class="{'selected': shared.docType === 'tutorial'}"
>{{$t('nav.tutorial')}}</a>
+ <a
+ :href="'option-gl.html'"
+ :class="{'selected': shared.docType === 'option-gl'}"
+ >{{$t('nav.optionGL')}}</a>
</div>
<div class="doc-mobile-toolbar">
<el-button
@@ -22,15 +26,15 @@
></el-button>
<Search></Search>
</div>
- <el-drawer
- direction="ltr"
- size="80%"
- :visible.sync="navShown"
- :show-close="false"
- >
- <DocNav></DocNav>
- </el-drawer>
</div>
+ <el-drawer
+ direction="ltr"
+ size="80%"
+ :visible.sync="navShown"
+ :show-close="false"
+ >
+ <DocNav></DocNav>
+ </el-drawer>
<transition>
<SearchResult v-if="shared.fuzzySearch"></SearchResult>
<!-- Always create a new component if page is changed -->
@@ -153,7 +157,7 @@ export default {
a {
display: inline-block;
line-height: 30px;
- width: 30%;
+ width: 22%;
text-align: center;
box-sizing: border-box;
text-decoration: none;
@@ -208,4 +212,5 @@ export default {
overflow-y: scroll;
}
}
+
</style>
\ No newline at end of file
diff --git a/src/components/DocContent.vue b/src/components/DocContent.vue
index 4059e06..019a011 100644
--- a/src/components/DocContent.vue
+++ b/src/components/DocContent.vue
@@ -213,13 +213,14 @@ export default {
line-height: 45px;
margin: 0;
font-weight: normal;
+ box-sizing: content-box;
}
h3 {
font-weight: normal;
color: #999;
font-size: 30px;
- margin-left: 15px;
+ margin: 20px 20px 20px 0;
}
.page-description {
diff --git a/src/components/SearchResult.vue b/src/components/SearchResult.vue
index 4689577..dd67eb0 100644
--- a/src/components/SearchResult.vue
+++ b/src/components/SearchResult.vue
@@ -134,6 +134,7 @@ export default {
h3 {
font-weight: normal;
font-size: 24px;
+ margin: 20px 20px 20px 0;
}
.result-summary {
@@ -146,4 +147,9 @@ export default {
}
}
+.ec-doc-mobile {
+ .doc-search-result {
+ padding: 0 10px;
+ }
+}
</style>
\ No newline at end of file
diff --git a/src/components/SearchResultItemCard.vue b/src/components/SearchResultItemCard.vue
index 458d866..f2c13c6 100644
--- a/src/components/SearchResultItemCard.vue
+++ b/src/components/SearchResultItemCard.vue
@@ -126,4 +126,10 @@ export default {
display: none;
}
}
+
+.ec-doc-mobile {
+ .doc-search-result-item-card {
+ margin: 30px 0;
+ }
+}
</style>
\ No newline at end of file
diff --git a/watch.js b/watch.js
deleted file mode 100644
index 067110f..0000000
--- a/watch.js
+++ /dev/null
@@ -1,85 +0,0 @@
-/**
- * ------------------------------------------------------------------------
- * Usage:
- *
- * ```shell
- * node watch.js --env dev
- * node watch.js --env asf
- * node watch.js --env echartsjs
- * # Check `./config` to see the available env
- * ```
- * ------------------------------------------------------------------------
- */
-
-var path = require('path');
-var fs = require('fs');
-var argv = require('yargs').argv;
-
-function initEnv() {
- var envType = argv.env;
- var isDev = argv.dev != null || argv.debug != null || envType === 'debug';
-
- if (isDev) {
- console.warn('=============================');
- console.warn('!!! THIS IS IN DEV MODE !!!');
- console.warn('=============================');
- envType = 'dev';
- }
-
- if (!envType) {
- throw new Error('--env MUST be specified');
- }
-
- return envType;
-}
-
-var envType = initEnv();
-
-var docSrcDirZH = path.join(__dirname, '/zh');
-var docSrcDirEN = path.join(__dirname, '/en');
-
-var watchDirs = [];
-getAllDirs(docSrcDirZH, watchDirs);
-getAllDirs(docSrcDirEN, watchDirs);
-
-var timer;
-
-watchDirs.forEach(function (p) {
- fs.watch(p, onChange);
-});
-
-function getAllDirs(rootDir, result) {
- if (fs.statSync(rootDir).isDirectory()) {
- result.push(rootDir);
-
- fs.readdirSync(rootDir).forEach(function(file, index) {
- getAllDirs(path.join(rootDir, file), result);
- });
- }
-}
-
-function onChange(event) {
- if (event === 'change') {
- console.log('File changed, auto compile ...');
-
- if (timer) {
- clearTimeout(timer);
- }
-
- timer = setTimeout(function () {
- execBuild(); // Writing may be not finished yet, and throttle.
- }, 1000);
- }
-}
-
-function execBuild() {
- require('child_process').exec(
- 'node build.js --env ' + envType,
- function (error, stdout, stderr) {
- if (error !== null) {
- console.log('exec error: ' + error);
- }
- console.log(stdout);
- }
- );
-}
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org