- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我正在努力使我更漂亮的作品正常工作。当我启动时 format-check
( prettier --check
在 js、ts 文件上)它给了我 SyntaxError: This experimental syntax requires enabling the parser plugin: 'classProperties'
尽管有以下配置,但许多类文件(甚至是具有一个属性和 getter 的简单文件)中的错误。当我在 .prettierrc.json
中将解析器从默认更改为其他内容时, 然后"@trivago/prettier-plugin-sort-imports"
插件不起作用。我想要配置,它不会给我提到的错误并允许排序插件工作。也许我在 eslint-prettier 线上有一些冲突?package.json
的一部分在主目录中
"devDependencies": {
"@babel/plugin-proposal-class-properties": "7.12.1",
"@types/react": "16.9.46",
"@types/react-dom": "16.9.8",
"@types/styled-components": "5.1.2",
"@typescript-eslint/eslint-plugin": "2.34.0",
"@typescript-eslint/parser": "2.34.0",
"@trivago/prettier-plugin-sort-imports": "1.3.0",
"eslint": "6.8.0",
"eslint-config-airbnb": "18.2.0",
"eslint-config-airbnb-base": "14.2.0",
"eslint-config-prettier": "6.11.0",
"eslint-plugin-eslint-comments": "3.2.0",
"eslint-plugin-eslint-plugin": "2.3.0",
"eslint-plugin-jest": "23.20.0",
"eslint-plugin-jsx-a11y": "5.1.1",
"eslint-plugin-prettier": "3.1.4",
"eslint-plugin-react": "7.20.6",
"eslint-plugin-react-hooks": "4.1.0",
"jest-styled-components": "7.0.3",
"lerna": "3.22.1",
"prettier": "2.2.1"
},
"scripts": {
"format": "prettier --write \"**/*.{ts,tsx,js,jsx}\"",
"format-check": "prettier --check \"**/*.{ts,tsx,js,jsx}\"",
...
},
"babel": {
"presets": [
"@babel/preset-env",
"@babel/preset-react",
{
"plugins": [
"@babel/plugin-proposal-class-properties",
{
"loose": true
}
]
}
]
}
.eslintrc.js
在主目录中
module.exports = {
root: true,
env: {
es6: true,
node: true,
jest: true,
},
plugins: ['@typescript-eslint'],
extends: [
'airbnb',
'plugin:react/recommended',
'plugin:react-hooks/recommended',
'plugin:jsx-a11y/strict',
'plugin:@typescript-eslint/eslint-recommended',
'plugin:@typescript-eslint/recommended',
'plugin:@typescript-eslint/recommended-requiring-type-checking',
'react-app',
],
parser: '@typescript-eslint/parser',
parserOptions: {
ecmaVersion: 2017, // Allows for the parsing of modern ECMAScript features
sourceType: 'module', // Allows for the use of imports
ecmaFeatures: {
jsx: true, // Allows for the parsing of JSX
},
project: ['./projects/*/tsconfig.json'],
},
settings: {
react: {
version: 'detect', // Tells eslint-plugin-react to automatically detect the version of React to use
},
},
};
.prettierrc.json
在主目录中
{
"semi": true,
"trailingComma": "all",
"singleQuote": true,
"printWidth": 120,
"tabWidth": 2,
"arrowParens": "always",
"importOrder": ["^[a-zA-Z](.*)$", "^@[a-zA-Z](.*)$$", "^[./]"],
"importOrderSeparation": true
}
最佳答案
如果将以下内容添加到 .prettierrc.json
中,它似乎可以正常工作启用所需的解析器插件:
"experimentalBabelParserPluginsList": ["classProperties", "jsx", "typescript"]
这是用
prettier
测试的2.3.2 和
@trivago/prettier-plugin-sort-imports
2.0.4.
.prettierrc.json
:
{
"semi": true,
"trailingComma": "all",
"singleQuote": true,
"printWidth": 120,
"tabWidth": 2,
"arrowParens": "always",
"importOrder": ["^[a-zA-Z](.*)$", "^@[a-zA-Z](.*)$$", "^[./]"],
"importOrderSeparation": true,
"experimentalBabelParserPluginsList": ["classProperties", "jsx", "typescript"]
}
关于reactjs - 更漂亮,eslint - classProperties 解析器插件错误,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/65284700/
当我在 Django 项目中设置 React 时,我遇到了这个错误 模块构建错误 模块构建失败(来自 ./node_modules/babel-loader/lib/index.js): 语法错误:C
我正在努力使我更漂亮的作品正常工作。当我启动时 format-check ( prettier --check 在 js、ts 文件上)它给了我 SyntaxError: This experimen
当我尝试运行 react js 时出现此错误当前未启用对实验性语法“classProperties”的支持申请。 我正在尝试增加 中的值当我点击一个` 这是关于我的工作的代码片段... impor
我最近在代码中遇到了一个有趣的错误,尽管我设法找到了修复程序,但我想知道是否有人可以解释该解决方案为何有效。这是一些代码 var Project = Backbone.Model.extend({
使用 react-native init MyApp 初始化应用程序时出现以下语法错误 SyntaxError: /Users/MyAccount/RNProjects/app/node_mo
Support for the experimental syntax 'classProperties' isn't currently enabled 我尝试了重新构建后仍然出现错误的解决方案。
我从这个例子中为 Web、Android 和 iOS 构建了一个跨平台的 monorepo 应用程序 https://github.com/brunolemos/react-native-web-mo
我一直收到这个 Support for the experimental syntax 'classProperties' isn't currently enabled 当我为我的 react 应用
好吧,我在尝试在我的 React-native 应用程序上启用 Jest 时遇到了很大的问题。本主题的每个答案都为我的 webpack 或 package.json 提供了不同的配置。我希望能在这里找
我对 React.js 非常陌生。我安装了 Laravel 5.7 并通过运行以下命令将 Vue.js 脚手架替换为 React: php artisan preset react 现在的问题是,我无
我有一个根据本教程设置的 monorepo:tutorial . 该项目由一个包含三个包的主文件夹 (series4) 组成,这三个包专注于 web、移动应用程序和通用代码 - 它们分别命名为 web
我是一名优秀的程序员,十分优秀!