我想使用新载体操作器的打字,但VS代码Pttier的延伸似乎并不承认,停止工作。
I have updated Typescript, Eslint, Prettier, and VS code Prettier extension to the latest versions but still getting the error.
是否有办法加以纠正或忽视?
页: 1
{
"name": "react-playground",
"private": true,
"version": "0.0.0",
"type": "module",
"scripts": {
"build": "tsc && vite build",
"dev": "vite",
"format": "prettier --write ./**/*.{cjs,ts,tsx,json,md,css,html}",
"lint": "eslint --ext .js,.jsx,.ts,.tsx src --fix",
"preview": "vite preview"
},
"dependencies": {
"@headlessui/react": "^1.7.9",
"@hookform/error-message": "^2.0.1",
"@hookform/resolvers": "^2.9.10",
"@tanstack/react-table": "^8.7.9",
"clsx": "^1.2.1",
"d3": "^7.8.2",
"date-fns": "^2.29.3",
"downshift": "^7.2.0",
"lodash": "^4.17.21",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-hook-form": "^7.43.0",
"recharts": "^2.3.2",
"styled-components": "^5.3.6",
"styled-system": "^5.1.5",
"zod": "^3.20.2"
},
"devDependencies": {
"@hookform/devtools": "^4.3.0",
"@styled/typescript-styled-plugin": "^0.20.0",
"@trivago/prettier-plugin-sort-imports": "^4.0.0",
"@types/d3": "^7.4.0",
"@types/eslint": "^8.21.0",
"@types/lodash": "^4.14.191",
"@types/node": "^18.11.18",
"@types/prettier": "^2.7.2",
"@types/react": "^18.0.27",
"@types/react-dom": "^18.0.10",
"@types/styled-components": "^5.1.26",
"@types/styled-system": "^5.1.16",
"@typescript-eslint/eslint-plugin": "^5.50.0",
"@typescript-eslint/parser": "^5.50.0",
"@vitejs/plugin-react": "^3.1.0",
"autoprefixer": "^10.4.13",
"babel-plugin-styled-components": "^2.0.7",
"eslint": "^8.33.0",
"eslint-config-prettier": "^8.6.0",
"eslint-import-resolver-typescript": "^3.5.3",
"eslint-plugin-import": "^2.27.5",
"eslint-plugin-prettier": "^4.2.1",
"eslint-plugin-react": "^7.32.2",
"eslint-plugin-react-hooks": "^4.6.0",
"eslint-plugin-tailwindcss": "^3.8.3",
"eslint-plugin-unused-imports": "^2.0.0",
"postcss": "^8.4.21",
"prettier": "^2.8.3",
"prettier-eslint": "^15.0.1",
"prettier-plugin-tailwindcss": "^0.2.2",
"tailwindcss": "^3.2.4",
"typescript": "^4.9.5",
"vite": "^4.1.1",
"vite-aliases": "^0.10.0",
"vite-plugin-babel-macros": "^1.0.6",
"vite-plugin-checker": "^0.5.5"
}
}
prettierrc.cjs
module.exports = {
semi: true,
printWidth: 80,
tabWidth: 4,
singleQuote: true,
bracketSpacing: true,
bracketSameLine: false,
useTabs: true,
arrowParens: avoid ,
jsxSingleQuote: true,
trailingComma: all ,
importOrderParserPlugins: [ classProperties , typescript , jsx ],
importOrder: [
^@/api/(.*)$ ,
^@/assets/(.*)$ ,
^@/components/(.*)$ ,
^@/features/(.*)$ ,
^@/pages/(.*)$ ,
^@/redux/(.*)$ ,
^@/styles/(.*)$ ,
^@/utils/(.*)$ ,
^[../] ,
^[./] ,
],
importOrderSeparation: true,
importOrderSortSpecifiers: true,
importOrderCaseInsensitive: true,
plugins: [
require.resolve( @trivago/prettier-plugin-sort-imports ),
require( prettier-plugin-tailwindcss ),
],
};
type DemoComponentProps = {
p1: string;
p2: number;
};
const DemoComponent: React.FC<DemoComponentProps> = ({ p1, p2 }) => {
return (
<div>
{p1} {p2}
</div>
);
};
function App() {
const props = {
p1: demo ,
p2: 42,
} satisfies DemoComponentProps;
return <DemoComponent {...props} />;
}
export default App;
Prettier CLI
> prettier --debug-check ./**/*.{cjs,ts,tsx,json,md,css,html}
.eslintrc.cjs
prettierrc.cjs
postcss.config.cjs
tailwind.config.cjs
src/theme.ts
src/vite-env.d.ts
src/App.tsx[error] src/App.tsx: SyntaxError: Missing semicolon. (17:11)
[error] 1 | type DemoComponentProps = {
[error] 2 | p1: string;
[error] 3 | p2: number;
[error] 4 | };
[error] 5 |
[error] 6 | const DemoComponent: React.FC<DemoComponentProps> = ({ p1, p2 }) => {
[error] 7 | return (
[error] 8 | <div>
[error] 9 | {p1} {p2}
[error] 10 | </div>
[error] 11 | );
[error] 12 | };
[error] 13 |
[error] 14 | function App() {
[error] 15 | const props = {
[error] 16 | p1: demo ,
[error] 17 | p2: 42, } satisfies DemoComponentProps;
[error] 18 |
[error] 19 | return <DemoComponent {...props} />;
[error] 20 | }
[error] 21 |
[error] 22 | export default App;
[error] 23 |
src/main.tsx
.vscode/settings.json
package.json
tsconfig.json
tsconfig.node.json
README.md
src/index.css
index.html
ELIFECYCLE Command failed with exit code 2.
VSCode pertteir (v9.10.4) error
["INFO" - 3:05:44 PM] Formatting file:///home/tanmay/Projects/Personal/react-playground/src/App.tsx
["INFO" - 3:05:44 PM] Using config file at /home/tanmay/Projects/Personal/react-playground/prettierrc.cjs
["DEBUG" - 3:05:44 PM] Local prettier module path: /home/tanmay/Projects/Personal/react-playground/node_modules/prettier/index.js
["INFO" - 3:05:44 PM] Using ignore file (if present) at /home/tanmay/Projects/Personal/react-playground/.prettierignore
["INFO" - 3:05:44 PM] File Info:
{
"ignored": false,
"inferredParser": "typescript"
}
["INFO" - 3:05:44 PM] Detected local configuration (i.e. .prettierrc or .editorconfig), VS Code configuration will not be used
["INFO" - 3:05:44 PM] Prettier Options:
{
"filepath": "/home/tanmay/Projects/Personal/react-playground/src/App.tsx",
"parser": "typescript",
"semi": true,
"printWidth": 80,
"tabWidth": 4,
"singleQuote": true,
"bracketSpacing": true,
"bracketSameLine": false,
"useTabs": true,
"arrowParens": "avoid",
"jsxSingleQuote": true,
"trailingComma": "all",
"importOrderParserPlugins": [
"classProperties",
"typescript",
"jsx"
],
"importOrder": [
"^@/api/(.*)$",
"^@/assets/(.*)$",
"^@/components/(.*)$",
"^@/features/(.*)$",
"^@/pages/(.*)$",
"^@/redux/(.*)$",
"^@/styles/(.*)$",
"^@/utils/(.*)$",
"^[../]",
"^[./]"
],
"importOrderSeparation": true,
"importOrderSortSpecifiers": true,
"importOrderCaseInsensitive": true,
"plugins": [
"/home/tanmay/Projects/Personal/react-playground/node_modules/.pnpm/@trivago+prettier-plugin-sort-imports@4.0.0_m4v26zq7vuhpofnm2r24kocxbu/node_modules/@trivago/prettier-plugin-sort-imports/lib/src/index.js",
{
"options": {
"tailwindConfig": {
"type": "string",
"category": "Tailwind CSS",
"description": "TODO"
}
},
"parsers": {
"html": {
"astFormat": "html"
},
"glimmer": {
"astFormat": "glimmer"
},
"lwc": {
"astFormat": "html"
},
"angular": {
"astFormat": "html"
},
"vue": {
"astFormat": "html"
},
"css": {
"astFormat": "postcss"
},
"scss": {
"astFormat": "postcss"
},
"less": {
"astFormat": "postcss"
},
"babel": {
"astFormat": "estree"
},
"babel-flow": {
"astFormat": "estree"
},
"flow": {
"astFormat": "estree"
},
"typescript": {
"astFormat": "estree"
},
"babel-ts": {
"astFormat": "estree"
},
"espree": {
"astFormat": "estree"
},
"meriyah": {
"astFormat": "estree"
},
"__js_expression": {
"astFormat": "estree"
}
},
"printers": {}
}
]
}
["ERROR" - 3:05:44 PM] Error formatting document.
["ERROR" - 3:05:44 PM] Missing semicolon. (18:2)
1 | type DemoComponentProps = {
2 | p1: string;
3 | p2: number;
4 | };
5 |
6 | const DemoComponent: React.FC<DemoComponentProps> = ({ p1, p2 }) => {
7 | return (
8 | <div>
9 | {p1} {p2}
10 | </div>
11 | );
12 | };
13 |
14 | function App() {
15 | const props = {
16 | p1: demo ,
17 | p2: 42,
18 | } satisfies DemoComponentProps;
19 |
20 | return <DemoComponent {...props} />;
21 | }
22 |
23 | export default App;
24 |
SyntaxError: Missing semicolon. (18:2)
1 | type DemoComponentProps = {
2 | p1: string;
3 | p2: number;
4 | };
5 |
6 | const DemoComponent: React.FC<DemoComponentProps> = ({ p1, p2 }) => {
7 | return (
8 | <div>
9 | {p1} {p2}
10 | </div>
11 | );
12 | };
13 |
14 | function App() {
15 | const props = {
16 | p1: demo ,
17 | p2: 42,
18 | } satisfies DemoComponentProps;
19 |
20 | return <DemoComponent {...props} />;
21 | }
22 |
23 | export default App;
24 |
at instantiate (/home/tanmay/Projects/Personal/react-playground/node_modules/.pnpm/@babel+parser@7.18.9/node_modules/@babel/parser/src/parse-error/credentials.js:61:22)
at toParseError (/home/tanmay/Projects/Personal/react-playground/node_modules/.pnpm/@babel+parser@7.18.9/node_modules/@babel/parser/src/parse-error.js:58:12)
at Parser.raise (/home/tanmay/Projects/Personal/react-playground/node_modules/.pnpm/@babel+parser@7.18.9/node_modules/@babel/parser/src/tokenizer/index.js:1736:19)
at Parser.semicolon (/home/tanmay/Projects/Personal/react-playground/node_modules/.pnpm/@babel+parser@7.18.9/node_modules/@babel/parser/src/parser/util.js:146:10)
at Parser.parseVarStatement (/home/tanmay/Projects/Personal/react-playground/node_modules/.pnpm/@babel+parser@7.18.9/node_modules/@babel/parser/src/parser/statement.js:904:10)
at Parser.parseVarStatement (/home/tanmay/Projects/Personal/react-playground/node_modules/.pnpm/@babel+parser@7.18.9/node_modules/@babel/parser/src/plugins/typescript/index.js:2702:33)
at Parser.parseStatementContent (/home/tanmay/Projects/Personal/react-playground/node_modules/.pnpm/@babel+parser@7.18.9/node_modules/@babel/parser/src/parser/statement.js:391:21)
at Parser.parseStatementContent (/home/tanmay/Projects/Personal/react-playground/node_modules/.pnpm/@babel+parser@7.18.9/node_modules/@babel/parser/src/plugins/typescript/index.js:2760:20)
at Parser.parseStatement (/home/tanmay/Projects/Personal/react-playground/node_modules/.pnpm/@babel+parser@7.18.9/node_modules/@babel/parser/src/parser/statement.js:329:17)
at Parser.parseBlockOrModuleBlockBody (/home/tanmay/Projects/Personal/react-playground/node_modules/.pnpm/@babel+parser@7.18.9/node_modules/@babel/parser/src/parser/statement.js:1082:25)
at Parser.parseBlockBody (/home/tanmay/Projects/Personal/react-playground/node_modules/.pnpm/@babel+parser@7.18.9/node_modules/@babel/parser/src/parser/statement.js:1058:10)
at Parser.parseBlock (/home/tanmay/Projects/Personal/react-playground/node_modules/.pnpm/@babel+parser@7.18.9/node_modules/@babel/parser/src/parser/statement.js:1028:10)
at Parser.parseFunctionBody (/home/tanmay/Projects/Personal/react-playground/node_modules/.pnpm/@babel+parser@7.18.9/node_modules/@babel/parser/src/parser/expression.js:2467:24)
at Parser.parseFunctionBodyAndFinish (/home/tanmay/Projects/Personal/react-playground/node_modules/.pnpm/@babel+parser@7.18.9/node_modules/@babel/parser/src/parser/expression.js:2440:10)
at Parser.parseFunctionBodyAndFinish (/home/tanmay/Projects/Personal/react-playground/node_modules/.pnpm/@babel+parser@7.18.9/node_modules/@babel/parser/src/plugins/typescript/index.js:2329:13)
at callback (/home/tanmay/Projects/Personal/react-playground/node_modules/.pnpm/@babel+parser@7.18.9/node_modules/@babel/parser/src/parser/statement.js:1301:12)
at Parser.withSmartMixTopicForbiddingContext (/home/tanmay/Projects/Personal/react-playground/node_modules/.pnpm/@babel+parser@7.18.9/node_modules/@babel/parser/src/parser/expression.js:2947:14)
at Parser.parseFunction (/home/tanmay/Projects/Personal/react-playground/node_modules/.pnpm/@babel+parser@7.18.9/node_modules/@babel/parser/src/parser/statement.js:1299:10)
at Parser.parseFunctionStatement (/home/tanmay/Projects/Personal/react-playground/node_modules/.pnpm/@babel+parser@7.18.9/node_modules/@babel/parser/src/parser/statement.js:750:17)
at Parser.parseStatementContent (/home/tanmay/Projects/Personal/react-playground/node_modules/.pnpm/@babel+parser@7.18.9/node_modules/@babel/parser/src/parser/statement.js:366:21)
at Parser.parseStatementContent (/home/tanmay/Projects/Personal/react-playground/node_modules/.pnpm/@babel+parser@7.18.9/node_modules/@babel/parser/src/plugins/typescript/index.js:2760:20)
at Parser.parseStatement (/home/tanmay/Projects/Personal/react-playground/node_modules/.pnpm/@babel+parser@7.18.9/node_modules/@babel/parser/src/parser/statement.js:329:17)
at Parser.parseBlockOrModuleBlockBody (/home/tanmay/Projects/Personal/react-playground/node_modules/.pnpm/@babel+parser@7.18.9/node_modules/@babel/parser/src/parser/statement.js:1082:25)
at Parser.parseBlockBody (/home/tanmay/Projects/Personal/react-playground/node_modules/.pnpm/@babel+parser@7.18.9/node_modules/@babel/parser/src/parser/statement.js:1058:10)
at Parser.parseProgram (/home/tanmay/Projects/Personal/react-playground/node_modules/.pnpm/@babel+parser@7.18.9/node_modules/@babel/parser/src/parser/statement.js:214:10)
at Parser.parseTopLevel (/home/tanmay/Projects/Personal/react-playground/node_modules/.pnpm/@babel+parser@7.18.9/node_modules/@babel/parser/src/parser/statement.js:197:25)
at Parser.parse (/home/tanmay/Projects/Personal/react-playground/node_modules/.pnpm/@babel+parser@7.18.9/node_modules/@babel/parser/src/parser/index.js:41:10)
at Parser.parse (/home/tanmay/Projects/Personal/react-playground/node_modules/.pnpm/@babel+parser@7.18.9/node_modules/@babel/parser/src/plugins/typescript/index.js:3749:20)
at Object.parse (/home/tanmay/Projects/Personal/react-playground/node_modules/.pnpm/@babel+parser@7.18.9/node_modules/@babel/parser/src/index.js:58:38)
at Object.preprocessor (/home/tanmay/Projects/Personal/react-playground/node_modules/.pnpm/@trivago+prettier-plugin-sort-imports@4.0.0_m4v26zq7vuhpofnm2r24kocxbu/node_modules/@trivago/prettier-plugin-sort-imports/lib/src/preprocessors/preprocessor.js:15:24)
at Object.defaultPreprocessor [as preprocess] (/home/tanmay/Projects/Personal/react-playground/node_modules/.pnpm/@trivago+prettier-plugin-sort-imports@4.0.0_m4v26zq7vuhpofnm2r24kocxbu/node_modules/@trivago/prettier-plugin-sort-imports/lib/src/preprocessors/default-processor.js:9:27)
at Object.preprocess (/home/tanmay/Projects/Personal/react-playground/node_modules/.pnpm/prettier-plugin-tailwindcss@0.2.2_ijmykednqrx66bjm6h37cegrgq/node_modules/prettier-plugin-tailwindcss/dist/index.js:134:3972)
at Object.parse (/home/tanmay/Projects/Personal/react-playground/node_modules/.pnpm/prettier@2.8.3/node_modules/prettier/index.js:7511:25)
at coreFormat (/home/tanmay/Projects/Personal/react-playground/node_modules/.pnpm/prettier@2.8.3/node_modules/prettier/index.js:8829:18)
at formatWithCursor2 (/home/tanmay/Projects/Personal/react-playground/node_modules/.pnpm/prettier@2.8.3/node_modules/prettier/index.js:9021:18)
at /home/tanmay/Projects/Personal/react-playground/node_modules/.pnpm/prettier@2.8.3/node_modules/prettier/index.js:38168:12
at Object.format (/home/tanmay/Projects/Personal/react-playground/node_modules/.pnpm/prettier@2.8.3/node_modules/prettier/index.js:38182:12)
at t.default.format (/home/tanmay/.vscode/extensions/esbenp.prettier-vscode-9.10.4/dist/extension.js:1:14731)
at t.PrettierEditProvider.provideEdits (/home/tanmay/.vscode/extensions/esbenp.prettier-vscode-9.10.4/dist/extension.js:1:11417)
at $.provideDocumentFormattingEdits (/usr/share/code/resources/app/out/vs/workbench/api/node/extensionHostProcess.js:98:39748)
["INFO" - 3:05:44 PM] Formatting completed in 19ms.