This is an automated email from the ASF dual-hosted git repository.
lidongdai pushed a commit to branch master
in repository
https://gitbox.apache.org/repos/asf/incubator-dolphinscheduler-website.git
The following commit(s) were added to refs/heads/master by this push:
new 26d613c Fix cache problem of js/css/html/json and optimize build and
render speed (#298)
26d613c is described below
commit 26d613cf3234f54a230ebea3dcd81be39b23af97
Author: Shiwen Cheng <[email protected]>
AuthorDate: Mon Feb 22 17:16:41 2021 +0800
Fix cache problem of js/css/html/json and optimize build and render speed
(#298)
---
gulpfile.js | 51 ++++++++++++++++++++++++++++++++++------
package.json | 14 +++++++----
redirect.ejs | 8 +++----
site_config/community.jsx | 1 -
site_config/site.js | 1 +
src/components/header/index.jsx | 4 ++--
src/components/md2html/index.jsx | 2 +-
src/pages/blog/index.md.scss | 3 ---
src/pages/home/index.scss | 1 +
src/reset.scss | 2 --
template.ejs | 27 +++++++++++++++------
webpack.config.js | 1 -
12 files changed, 82 insertions(+), 33 deletions(-)
diff --git a/gulpfile.js b/gulpfile.js
index 445ac22..1960ae9 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -7,6 +7,10 @@ const path = require('path');
const fs = require('fs-extra');
const WebpackDevServer = require('webpack-dev-server');
const CopyWebpackPlugin = require('copy-webpack-plugin');
+const ExtractTextPlugin = require('extract-text-webpack-plugin');
+const OptimizeCSSPlugin = require('optimize-css-assets-webpack-plugin');
+const CleanWebpackPlugin = require('clean-webpack-plugin');
+const WebpackManifestPlugin = require('webpack-manifest-plugin');
const siteConfig = require('./site_config/site').default;
const webpackConfig = require('./webpack.config.js');
@@ -16,12 +20,16 @@ const port = siteConfig.port || 8080;
gulp.task('webpack-dev-server', () => {
// modify some webpack config options
const myConfig = Object.create(webpackConfig);
- myConfig.plugins.push(new webpack.SourceMapDevToolPlugin({}));
+ myConfig.plugins = myConfig.plugins.concat(
+ new ExtractTextPlugin('[name].css'),
+ new webpack.SourceMapDevToolPlugin({})
+ );
// Start a webpack-dev-server
new WebpackDevServer(webpack(myConfig), {
publicPath: `http://127.0.0.1:${port}/build/`,
stats: {
colors: true,
+ children: false,
},
}).listen(port, '127.0.0.1', (err) => {
if (err) throw new gutil.PluginError('webpack-dev-server', err);
@@ -34,6 +42,7 @@ gulp.task('webpack:build', (callback) => {
// modify some webpack config options
const myConfig = Object.create(webpackConfig);
myConfig.output.publicPath = `${siteConfig.rootPath}/build/`;
+ myConfig.output.filename = '[name].[chunkhash:7].js';
myConfig.plugins = myConfig.plugins.concat(
new webpack.DefinePlugin({
'process.env': {
@@ -41,9 +50,25 @@ gulp.task('webpack:build', (callback) => {
NODE_ENV: JSON.stringify('production'),
},
}),
- new webpack.optimize.UglifyJsPlugin(),
+ new CleanWebpackPlugin({ cleanOnceBeforeBuildPatterns: [distdir] }),
+ new ExtractTextPlugin({
+ filename: '[name].[contenthash:7].css',
+ allChunks: true,
+ }),
+ new OptimizeCSSPlugin({ cssProcessorOptions: { safe: true } }),
+ new webpack.optimize.UglifyJsPlugin({
+ uglifyOptions: {
+ compress: { warnings: false },
+ },
+ parallel: true,
+ }),
+ new webpack.optimize.CommonsChunkPlugin({
+ name: 'vendor',
+ minChunks: 2,
+ }),
+ new WebpackManifestPlugin({ publicPath: '' }),
new CopyWebpackPlugin((() => {
- const entries = ['.asf.yaml', 'sitemap.xml', 'file', 'img'];
+ const entries = [];
const pages = fs.readdirSync(path.join(__dirname, './src/pages'));
pages.forEach((page) => {
if (page === 'home') return;
@@ -58,11 +83,12 @@ gulp.task('webpack:build', (callback) => {
to: path.join(distdir, entry),
ignore: ['*.md', '*.markdown'],
}));
- })()),
- new CopyWebpackPlugin([
- { from: path.join(distdir, siteConfig.defaultLanguage, 'index.html'),
to: path.join(distdir, 'index.html') },
- ])
+ })())
);
+ if (process.env.report_analyzer) {
+ const BundleAnalyzerPlugin =
require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
+ myConfig.plugins.push(new BundleAnalyzerPlugin());
+ }
// run webpack
webpack(myConfig, (err, stats) => {
@@ -77,6 +103,17 @@ gulp.task('webpack:build', (callback) => {
});
});
+gulp.task('post-build', (callback) => {
+ fs.removeSync(path.join(distdir, 'build/manifest.json'), { force: true });
+ if (Array.isArray(siteConfig.copyToDist)) {
+ siteConfig.copyToDist.forEach((item) => {
+ fs.copySync(path.join(__dirname, item), path.join(distdir, item));
+ });
+ }
+ fs.copySync(path.join(distdir, siteConfig.defaultLanguage, 'index.html'),
path.join(distdir, 'index.html'));
+ callback();
+});
+
// The development server (the recommended option for development)
gulp.task('default', gulp.series('webpack-dev-server'));
diff --git a/package.json b/package.json
index 62f724f..836a42c 100644
--- a/package.json
+++ b/package.json
@@ -5,8 +5,9 @@
"scripts": {
"start": "docsite start",
"build": "docsite build",
- "lint": "eslint --ext .js,.jsx ./src ./utils ./site_config ./gulpfile.js
./webpack.config.js",
- "lint:fix": "eslint --ext .js,.jsx --fix ./src ./utils ./site_config
./gulpfile.js ./webpack.config.js"
+ "report": "report_analyzer=true docsite build",
+ "lint": "eslint --ext .js,.jsx src utils site_config gulpfile.js
webpack.config.js",
+ "lint:fix": "eslint --ext .js,.jsx --fix src utils site_config gulpfile.js
webpack.config.js"
},
"dependencies": {
"antd": "^3.26.20",
@@ -34,11 +35,12 @@
"babel-preset-react": "^6.24.1",
"babel-preset-stage-0": "6.24.1",
"babel-register": "^6.26.0",
+ "clean-webpack-plugin": "^2.0.2",
"commander": "^2.20.3",
"copy-webpack-plugin": "^4.6.0",
"css-loader": "0.28.11",
"css-modules-require-hook": "^4.2.3",
- "docsite-ext": "^1.4.4",
+ "docsite-ext": "^1.5.0",
"eslint": "^5.16.0",
"eslint-config-ali": "^4.1.1",
"eslint-plugin-import": "*",
@@ -51,11 +53,13 @@
"node-libs-browser": "2.2.1",
"node-sass": "^4.14.1",
"opn": "^5.3.0",
- "postcss": "^6.0.23",
+ "optimize-css-assets-webpack-plugin": "^3.2.1",
"raw-loader": "^0.5.1",
"sass-loader": "7.3.1",
"style-loader": "0.6.5",
"webpack": "^3.12.0",
- "webpack-dev-server": "2.11.5"
+ "webpack-bundle-analyzer": "^4.4.0",
+ "webpack-dev-server": "2.11.5",
+ "webpack-manifest-plugin": "^2.2.0"
}
}
diff --git a/redirect.ejs b/redirect.ejs
index 0b3dfb7..b72e08e 100644
--- a/redirect.ejs
+++ b/redirect.ejs
@@ -2,10 +2,10 @@
<html lang="en">
<head>
<title>Apache DolphinScheduler is a distributed and easy-to-extend visual
workflow scheduler system, dedicated to solving the complex task dependencies
in data processing, making the scheduling system out of the box for data
processing.</title>
- <meta charset="UTF-8"/>
- <meta name="description" content="Apache DolphinScheduler is a distributed
and easy-to-extend visual workflow scheduler system, dedicated to solving the
complex task dependencies in data processing, making the scheduling system out
of the box for data processing."/>
- <meta name="keywords" content="Apache DolphinScheduler Official
Website,dolphinscheduler.apache.org"/>
- <link rel="shortcut icon" href="<%= rootPath %>/img/favicon.ico"/>
+ <meta charset="UTF-8">
+ <meta name="description" content="Apache DolphinScheduler is a distributed
and easy-to-extend visual workflow scheduler system, dedicated to solving the
complex task dependencies in data processing, making the scheduling system out
of the box for data processing.">
+ <meta name="keywords" content="Apache DolphinScheduler Official
Website,dolphinscheduler.apache.org">
+ <link rel="shortcut icon" href="<%= rootPath %>/img/favicon.ico">
</head>
<body>
<script
src="//cdn.jsdelivr.net/npm/js-cookie@2/src/js.cookie.min.js"></script>
diff --git a/site_config/community.jsx b/site_config/community.jsx
index f106f10..fc48da0 100644
--- a/site_config/community.jsx
+++ b/site_config/community.jsx
@@ -240,7 +240,6 @@ export default {
},
{
title: '订阅邮件列表',
- target: '_blank',
link: '/zh-cn/community/development/subscribe.html',
},
{
diff --git a/site_config/site.js b/site_config/site.js
index d933ef8..6f2d277 100644
--- a/site_config/site.js
+++ b/site_config/site.js
@@ -3,6 +3,7 @@ export default {
rootPath: '', // 发布到服务器的根目录，需以/开头但不能有尾/，如果只有/，请填写空字符串
port: 8080, // 本地开发服务器的启动端口
domain: 'dolphinscheduler.incubator.apache.org', // 站点部署域名，无需协议和path等
+ copyToDist: ['img', 'file', '.asf.yaml', 'sitemap.xml', '.nojekyll'], //
当build发布时，需要额外复制到dist目录的资源，默认有：index.html, 404.html, en-us, zh-cn, build
defaultSearch: 'google', // 默认搜索引擎，baidu或者google
defaultLanguage: 'en-us',
'en-us': {
diff --git a/src/components/header/index.jsx b/src/components/header/index.jsx
index de3ebaa..714e2c8 100644
--- a/src/components/header/index.jsx
+++ b/src/components/header/index.jsx
@@ -4,9 +4,9 @@ import classnames from 'classnames';
import { autobind } from 'core-decorators';
import siteConfig from '../../../site_config/site';
import { getLink } from '../../../utils';
-import 'antd/dist/antd.css';
+import Menu from 'antd/lib/menu';
+import 'antd/lib/menu/style/index.css';
import './index.scss';
-import { Menu } from 'antd';
const { SubMenu } = Menu;
const languageSwitch = [
diff --git a/src/components/md2html/index.jsx b/src/components/md2html/index.jsx
index 1bfbd99..98b2e4b 100644
--- a/src/components/md2html/index.jsx
+++ b/src/components/md2html/index.jsx
@@ -17,7 +17,7 @@ const Md2Html = ComposeComponent => class extends
ComposeComponent {
componentDidMount() {
// 通过请求获取生成好的json数据，静态页和json文件在同一个目录下
- fetch(window.location.pathname.replace(/\.html$/i, '.json'))
+ fetch(`${window.location.pathname.replace(/\.html$/i, '.json')}?t=${new
Date().getTime()}`)
.then(res => res.json())
.then((md) => {
this.setState({
diff --git a/src/pages/blog/index.md.scss b/src/pages/blog/index.md.scss
index 20dee13..7e83c19 100644
--- a/src/pages/blog/index.md.scss
+++ b/src/pages/blog/index.md.scss
@@ -1,7 +1,4 @@
@import '../../variables.scss';
-@import '../../reset.scss';
-@import '../../markdown.scss';
-
.blog-detail-page {
.blog-content {
padding: 80px 20%;
diff --git a/src/pages/home/index.scss b/src/pages/home/index.scss
index d0e4bc5..163b9ca 100644
--- a/src/pages/home/index.scss
+++ b/src/pages/home/index.scss
@@ -1,5 +1,6 @@
@import '../../variables.scss';
@import '../../reset.scss';
+
@keyframes slashStar {
0% {
opacity: 1; }
diff --git a/src/reset.scss b/src/reset.scss
index f5c3568..4ce5cdd 100644
--- a/src/reset.scss
+++ b/src/reset.scss
@@ -1,5 +1,3 @@
-@import './markdown.scss';
-
* {
padding: 0;
margin: 0;
diff --git a/template.ejs b/template.ejs
index fe89de2..948d07f 100644
--- a/template.ejs
+++ b/template.ejs
@@ -3,18 +3,31 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0,
maximum-scale=1.0, user-scalable=no">
- <meta name="keywords" content="<%= keywords %>" />
- <meta name="description" content="<%= description %>" />
+ <meta name="keywords" content="<%= keywords %>">
+ <meta name="description" content="<%= description %>">
+ <meta http-equiv="Cache-Control" content="no-cache, no-store,
must-revalidate">
+ <meta http-equiv="Pragma" content="no-cache">
+ <meta http-equiv="Expires" content="0">
<title><%= title %></title>
- <link rel="shortcut icon" href="<%= rootPath %>/img/favicon.ico"/>
- <link rel="stylesheet" href="<%= rootPath %>/build/<%= page %>.css" />
+ <link rel="shortcut icon" href="<%= rootPath %>/img/favicon.ico">
+ <%_ if (vendorCssPath) { _%>
+ <link rel="stylesheet" href="<%= rootPath %>/build/<%= vendorCssPath %>">
+ <%_ } _%>
+ <%_ if (pageCssPath) { _%>
+ <link rel="stylesheet" href="<%= rootPath %>/build/<%= pageCssPath %>">
+ <%_ } _%>
</head>
<body>
<div id="root"><%- __html %></div>
- <script
src="https://f.alicdn.com/react/15.4.1/react-with-addons.min.js";></script>
- <script src="https://f.alicdn.com/react/15.4.1/react-dom.min.js";></script>
+ <script
src="//cdn.jsdelivr.net/npm/[email protected]/dist/react-with-addons.min.js"></script>
+ <script
src="//cdn.jsdelivr.net/npm/[email protected]/dist/react-dom.min.js"></script>
<script>window.rootPath = '<%= rootPath %>';</script>
- <script src="<%= rootPath %>/build/<%= page %>.js"></script>
+ <%_ if (vendorJsPath) { _%>
+ <script src="<%= rootPath %>/build/<%= vendorJsPath %>"></script>
+ <%_ } _%>
+ <%_ if (pageJsPath) { _%>
+ <script src="<%= rootPath %>/build/<%= pageJsPath %>"></script>
+ <%_ } _%>
<script>
var _hmt = _hmt || [];
(function() {
diff --git a/webpack.config.js b/webpack.config.js
index f2d1c06..3370b0e 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -63,6 +63,5 @@ module.exports = {
plugins: [
new webpack.NoEmitOnErrorsPlugin(),
new webpack.optimize.OccurrenceOrderPlugin(),
- new ExtractTextPlugin('[name].css'),
],
};
