mirror of
https://github.com/ant-design/ant-design.git
synced 2025-08-06 16:06:28 +08:00
Provide a debug way of preact compatibility (#7670)
* try preact * Add start:preact to scripts * fix webpack.config.js
This commit is contained in:
parent
8904b50720
commit
0ffccf8b0f
@ -123,6 +123,8 @@
|
||||
"mockdate": "^2.0.1",
|
||||
"moment-timezone": "^0.5.5",
|
||||
"pre-commit": "^1.2.2",
|
||||
"preact": "^8.2.5",
|
||||
"preact-compat": "^3.17.0",
|
||||
"querystring": "^0.2.0",
|
||||
"rc-queue-anim": "^1.0.1",
|
||||
"rc-scroll-anim": "^1.0.3",
|
||||
@ -160,7 +162,8 @@
|
||||
"dist": "antd-tools run dist",
|
||||
"compile": "antd-tools run compile",
|
||||
"tsc": "tsc",
|
||||
"start": "cross-env NODE_ENV=development node ./scripts/generateColorLess.js && bisheng start -c ./site/bisheng.config.js --no-livereload",
|
||||
"start": "node ./scripts/generateColorLess.js && cross-env NODE_ENV=development bisheng start -c ./site/bisheng.config.js --no-livereload",
|
||||
"start:preact": "node ./scripts/generateColorLess.js && cross-env NODE_ENV=development REACT_ENV=preact bisheng start -c ./site/bisheng.config.js --no-livereload",
|
||||
"site": "cross-env NODE_ENV=production bisheng build --ssr -c ./site/bisheng.config.js",
|
||||
"deploy": "antd-tools run clean && npm run site && node ./scripts/generateColorLess.js && bisheng gh-pages --push-only",
|
||||
"pub": "antd-tools run pub",
|
||||
|
@ -2,6 +2,7 @@ const path = require('path');
|
||||
const CSSSplitWebpackPlugin = require('css-split-webpack-plugin').default;
|
||||
|
||||
const isDev = process.env.NODE_ENV === 'development';
|
||||
const usePreact = process.env.REACT_ENV === 'preact';
|
||||
|
||||
module.exports = {
|
||||
port: 8001,
|
||||
@ -65,11 +66,21 @@ module.exports = {
|
||||
config.externals = {
|
||||
'react-router-dom': 'ReactRouterDOM',
|
||||
};
|
||||
if (isDev) {
|
||||
Object.assign(config.externals, {
|
||||
|
||||
if (usePreact) {
|
||||
config.resolve.alias = {
|
||||
...config.resolve.alias,
|
||||
react: 'preact-compat',
|
||||
'react-dom': 'preact-compat',
|
||||
'create-react-class': 'preact-compat/lib/create-react-class',
|
||||
'react-router': 'react-router',
|
||||
};
|
||||
} else {
|
||||
config.externals = {
|
||||
...config.externals,
|
||||
react: 'React',
|
||||
'react-dom': 'ReactDOM',
|
||||
});
|
||||
};
|
||||
}
|
||||
|
||||
config.babel.plugins.push([
|
||||
@ -84,7 +95,9 @@ module.exports = {
|
||||
|
||||
return config;
|
||||
},
|
||||
|
||||
htmlTemplateExtraData: {
|
||||
isDev,
|
||||
usePreact,
|
||||
},
|
||||
};
|
||||
|
@ -109,13 +109,15 @@
|
||||
</head>
|
||||
<body>
|
||||
<div id="react-content">
|
||||
{% if isDev %}
|
||||
<script src="https://as.alipayobjects.com/g/component/??react/15.6.1/react.js,react/15.6.1/react-dom.js"></script>
|
||||
{% else %}
|
||||
<script src="https://as.alipayobjects.com/g/component/??react/15.6.1/react.min.js,react/15.6.1/react-dom.min.js"></script>
|
||||
{% endif %}
|
||||
{{ content | safe }}
|
||||
</div>
|
||||
{% if not usePreact %}
|
||||
{% if isDev %}
|
||||
<script src="https://as.alipayobjects.com/g/component/??react/15.6.1/react.js,react/15.6.1/react-dom.js"></script>
|
||||
{% else %}
|
||||
<script src="https://as.alipayobjects.com/g/component/??react/15.6.1/react.min.js,react/15.6.1/react-dom.min.js"></script>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
<script src="{{ root }}common.js"></script>
|
||||
<script src="{{ root }}index.js"></script>
|
||||
</body>
|
||||
|
@ -170,22 +170,20 @@ export default class MainContent extends React.Component {
|
||||
}
|
||||
|
||||
flattenMenu(menu) {
|
||||
if (menu.type === Menu.Item) {
|
||||
if (menu && menu.type && !menu.type.isSubMenu && !menu.type.isMenuItemGroup) {
|
||||
return menu;
|
||||
}
|
||||
|
||||
if (Array.isArray(menu)) {
|
||||
return menu.reduce((acc, item) => acc.concat(this.flattenMenu(item)), []);
|
||||
}
|
||||
|
||||
return this.flattenMenu(menu.props.children);
|
||||
return this.flattenMenu((menu.props && menu.props.children) || menu.children);
|
||||
}
|
||||
|
||||
getFooterNav(menuItems, activeMenuItem) {
|
||||
const menuItemsList = this.flattenMenu(menuItems);
|
||||
let activeMenuItemIndex = -1;
|
||||
menuItemsList.forEach((menuItem, i) => {
|
||||
if (menuItem.key === activeMenuItem) {
|
||||
if (menuItem && menuItem.key === activeMenuItem) {
|
||||
activeMenuItemIndex = i;
|
||||
}
|
||||
});
|
||||
@ -236,12 +234,12 @@ export default class MainContent extends React.Component {
|
||||
<section className="prev-next-nav">
|
||||
{
|
||||
prev ?
|
||||
React.cloneElement(prev.props.children, { className: 'prev-page' }) :
|
||||
React.cloneElement(prev.props.children || prev.children[0], { className: 'prev-page' }) :
|
||||
null
|
||||
}
|
||||
{
|
||||
next ?
|
||||
React.cloneElement(next.props.children, { className: 'next-page' }) :
|
||||
React.cloneElement(next.props.children || next.children[0], { className: 'next-page' }) :
|
||||
null
|
||||
}
|
||||
</section>
|
||||
|
Loading…
Reference in New Issue
Block a user