javascript - 语法错误:标识符直接在数字之后
问题描述
我正在使用一个以这种方式定义颜色的库:500_。在库的代码中每次提到这一点都会引发语法错误。
在我朋友的电脑上可以正常使用,请问如何解决?
调色板.js:
import { alpha } from '@material-ui/core/styles';
function createGradient(color1, color2) {
return `linear-gradient(to bottom, ${color1}, ${color2})`;
}
// SETUP COLORS
const GREY = {
0: '#FFFFFF',
100: '#F9FAFB',
200: '#F4F6F8',
300: '#DFE3E8',
400: '#C4CDD5',
500: '#919EAB',
600: '#637381',
700: '#454F5B',
800: '#212B36',
900: '#161C24',
500_8: alpha('#919EAB', 0.08),
500_12: alpha('#919EAB', 0.12),
500_16: alpha('#919EAB', 0.16),
500_24: alpha('#919EAB', 0.24),
500_32: alpha('#919EAB', 0.32),
500_48: alpha('#919EAB', 0.48),
500_56: alpha('#919EAB', 0.56),
500_80: alpha('#919EAB', 0.8)
};
错误:
Failed to compile.
./src/theme/overrides/Input.js
Syntax error: Identifier directly after number (24:53)
22 | underline: {
23 | '&:before': {
> 24 | borderBottomColor: theme.palette.grey[500_56]
| ^
25 | }
26 | }
27 | }
错误:
Failed to compile.
./src/components/charts/BaseOptionChart.js
Syntax error: Identifier directly after number (20:50)
18 | border: '0 !important',
19 | fontWeight: theme.typography.fontWeightBold,
> 20 | backgroundColor: `${theme.palette.grey[500_16]} !important`,
| ^
21 | color: theme.palette.text.secondary
22 | },
23 | '.apexcharts-xaxistooltip-bottom': {
解决方案
感谢所有帮助过的人,这确实是一个 babel 问题。
简而言之,全局安装即可修复:
npm install --save-dev @babel/plugin-proposal-numeric-separator
推荐阅读
- javascript - React组件在第一次加载时显示空数据,但在刷新后正确呈现?
- mysql - 对行子集应用聚合函数,然后根据聚合过滤子集
- arrays - 使用 bash 将字符串数组中的数字用于用户输入
- ruby - 如何确定哪些 gem 与 Ruby 版本捆绑在一起
- html - 为什么我的菜单在我刚打开时会自动关闭?
- c - 我如何防止 C 中的字符串数组的其余部分被垃圾填充?
- javascript - Javascript 上 Luhm 算法的信用卡检查器
- python - 这个算法的效率可以是线性的吗?
- junit - 模拟 KafkaConsumer poll() JUnit
- ios - SwiftUI Firestore 查询游标分页不起作用