我刚刚在typescript react项目中安装了storybook,但当我运行yarn storybook时,它开始抛出错误。这是它生成的代码,这是它抛出的"as“关键字的错误
-- Error message
Parsing error: Missing semicolon
10 | backgroundColor: { control: 'color' }
11 | }
> 12 | } as Meta;
| ^
13 |
14 | const Template: Story<ButtonProps> = (args) => <Button {...args} />;
15 |eslint
-- code
export default {
title: 'Example/Button',
component: Button,
argTypes: {
backgroundColor: { control: 'color' }
}
} as Meta;
-- my eslint config
{
"env": {
"es6": true,
"node": true,
"browser": true,
"jest": true
},
"plugins": ["react", "prettier"],
"extends": [
"airbnb",
"prettier",
"eslint:recommended", // Uses the recommended rules from @eslint-plugin-react
"plugin:react/recommended"
],
"parserOptions": {
"ecmaVersion": 2020,
"sourceType": "module",
"allowImportExportEverywhere": true,
"ecmaFeatures": {
"jsx": true // Allows for the parsing of JSX
}
},
"rules": {
"prettier/prettier": "error",
"no-console": "warn",
"import/first": "warn",
"quotes": ["error", "single", { "avoidEscape": true }],
"react/jsx-filename-extension": [1, { "extensions": [".tsx", ".ts"] }],
"jsx-quotes": [2, "prefer-single"],
"indent": ["error", 2],
"import/extensions": [
"error",
"ignorePackages",
{
"js": "never",
"jsx": "never",
"ts": "never",
"tsx": "never"
}
]
},
"parser": "babel-eslint",
"settings": {
"import/resolver": {
"node": {
"extensions": [".js", ".jsx", ".ts", ".tsx"]
}
},
"react": {
"version": "latest" // "detect" automatically picks the version you have installed.
}
}
}--忽略下面的内容
Lorem Ipsum只是印刷和排版行业的虚拟文本。自15世纪以来,Lorem Ipsum一直是业界的标准虚拟文本,当时一家不知名的印刷商拿出了一个排版,然后把它弄乱了,做成了一个排版样本簿。它不仅存活了五个世纪,还经历了电子排版的飞跃,基本上保持不变。它在20世纪60年代随着包含Lorem Ipsum段落的Letraset sheets的发布而流行起来,最近又随着包括Lorem Ipsum版本的桌面出版软件Aldus PageMaker而流行起来。
发布于 2021-06-22 14:31:08
看起来您的babelrc文件中缺少@babel/preset-typescript预设。
以下是我的.babelrc的一个示例
{
"presets": [
"@babel/preset-env",
"@babel/preset-react",
"@babel/preset-typescript"
],
"plugins": [
"@babel/plugin-proposal-class-properties",
"babel-plugin-transform-scss"
]
}可以使用以下命令安装预设:
npm install --save-dev @babel/preset-typescript或-yarn add -D @babel/preset-typescript我已经为react项目准备了其他预置,但我希望这能对你有所帮助!
以下是官方文档:https://babeljs.io/docs/en/babel-preset-typescript#installation
送去善意
https://stackoverflow.com/questions/67652785
复制相似问题