ant-design / ant-design/create-react-app-antd
Ant Version Update
- Dominant language
- JavaScript
- Stars
- 576
- Forks
- 186
- PR merge metrics
- No merged PRs in 30d
Description
There's been a few fixes to Antd since 4.0.0..., more concretely one that throws errors to console when using the Space component. So after playing with it, I managed to get it working by changing the base file used for the less_hack. I don't seem to be able to push a new branch, so here's the fix:
Line 5, index.ts
`
hack_less: ``true:rue;@import "${require.resolve('antd/lib/style/themes/default.less')}";``,
`
(can't seem to escape literals properly here)
If you (like me) don't want to wait, or want to have it in a single file instead of a dependency for some reason, I managed to make it work all the same just by adding the transcribed file file (and insert its output to modifyVars):
`var __assign =
(this && this.__assign) ||
function () {
__assign =
Object.assign ||
function (t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s)
if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
var __importDefault =
(this && this.__importDefault) ||
function (mod) {
return mod && mod.__esModule ? mod : { default: mod };
};
Object.defineProperty(exports, '__esModule', { value: true });
/* eslint-disable @typescript-eslint/camelcase */
var dark_theme_1 = __importDefault(require('antd/dist/dark-theme'));
exports.default = __assign(
__assign(
{
hack_less:
'true:rue;@import "' +
require.resolve('antd/lib/style/themes/default.less') +
'";', //+
},
dark_theme_1.default
),
{
'@light': '#fff',
'@tabs-horizontal-padding': '12px 0',
// zIndex': 'notification > popover > tooltip
'@zindex-notification': '1063',
'@zindex-popover': '1061',
'@zindex-tooltip': '1060',
// width
'@anchor-border-width': '1px',
// margin
'@form-item-margin-bottom': '24px',
'@menu-item-vertical-margin': '0px',
'@menu-item-boundary-margin': '0px',
// size
'@font-size-base': '14px',
'@font-size-lg': '16px',
'@screen-xl': '1208px',
'@screen-lg': '1024px',
'@screen-md': '768px',
// 移动
'@screen-sm': '767.9px',
// 超小屏
'@screen-xs': '375px',
// 官网
'@site-text-color': '@text-color',
'@site-border-color-split': 'fade(@light, 5)',
'@site-heading-color': '@heading-color',
'@site-header-box-shadow':
'0 0.3px 0.9px rgba(0, 0, 0, 0.12), 0 1.6px 3.6px rgba(0, 0, 0, 0.12)',
'@home-text-color': '@text-color',
//自定义需要找设计师
'@gray-8': '@text-color',
'@background-color-base': '#555',
'@skeleton-color': 'rgba(0,0,0,0.8)',
// pro
'@pro-header-box-shadow': '@site-header-box-shadow',
}
);
`
Thanks!
Contributor guide
No contributing guide indexed for this repository
Research direction
Start with line 5 of index.ts and inspect how the less_hack base file is assembled for Ant Design. Apply the reported base-file update and verify that using the Space component no longer throws errors to the console; no test file is named in the issue.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript, react
- Domain
- build-system, frontend
- Issue type
- Bug
- Difficulty
- 2/5
- Estimated time
- 1-3 hours
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 45/100