搜索到
2
篇与
的结果
-
vue3 必要tsconfig配置 { "compilerOptions": { // Most non-library projects don't need to emit declarations. // So we add this option by default to make the config more friendly to most users. "noEmit": true, // When type-checking with solution-style tsconfigs, though with `noEmit: true`, there won't // be any `.d.ts` files emitted, but tsc still writes a `.tsbuildinfo` file to the `outDir` // for each project. If we don't explicitly set the `outDir`, it will be in the same folder // as the `tsconfig.json` file, which would look messy. // Setting it to `./dist/` isn't ideal either, because it would pollute the `dist` folder. // So we set it to a hidden folder in `node_modules` to avoid polluting the project root. // FIXME: // This caused a regression: https://github.com/vuejs/tsconfig/issues/27 // Need to find a better solution. // "outDir": "./node_modules/.cache/vue-tsbuildinfo", // As long as you are using a build tool, we recommend you to author and ship in ES modules. // Even if you are targeting Node.js, because // - `CommonJS` is too outdated // - the ecosystem hasn't fully caught up with `Node16`/`NodeNext` // This recommendation includes environments like Vitest, Vite Config File, Vite SSR, etc. "module": "ESNext", // We expect users to use bundlers. // So here we enable some resolution features that are only available in bundlers. "moduleResolution": "bundler", "resolveJsonModule": true, // `allowImportingTsExtensions` can only be used when `noEmit` or `emitDeclarationOnly` is set. // But `noEmit` may cause problems with solution-style tsconfigs: // <https://github.com/microsoft/TypeScript/issues/49844> // And `emitDeclarationOnly` is not always wanted. // Considering it's not likely to be commonly used in Vue codebases, we don't enable it here. // Required in Vue projects，缺少这两个配置，import vue文件时会报错 因为vue文件本身没有正常导出对象 "jsx": "preserve", "jsxImportSource": "vue", // `"noImplicitThis": true` is part of `strict` // Added again here in case some users decide to disable `strict`. // This enables stricter inference for data properties on `this`. "noImplicitThis": true, "strict": true, // <https://devblogs.microsoft.com/typescript/announcing-typescript-5-0/#verbatimmodulesyntax> // Any imports or exports without a type modifier are left around. This is important for `<script setup>`. // Anything that uses the type modifier is dropped entirely. "verbatimModuleSyntax": true, // A few notes: // - Vue 3 supports ES2016+ // - For Vite, the actual compilation target is determined by the // `build.target` option in the Vite config. // So don't change the `target` field here. It has to be // at least `ES2020` for dynamic `import()`s and `import.meta` to work correctly. // - If you are not using Vite, feel free to overwrite the `target` field. "target": "ESNext", // For spec compilance. // `true` by default if the `target` is `ES2020` or higher. // Explicitly set it to `true` here in case some users want to overwrite the `target`. "useDefineForClassFields": true, // Recommended "esModuleInterop": true, "forceConsistentCasingInFileNames": true, // See <https://github.com/vuejs/vue-cli/pull/5688> "skipLibCheck": true, } } -
react 项目构建时构建失败提示XXXcannot be used as a JSX component react 项目构建时构建失败，报错信息如下[2023-06-06 11:12:51]TS2786: 'StatusTip' cannot be used as a JSX component. [2023-06-06 11:12:51] Its type 'FunctionComponent> & { LoadingTip: ForwardRefExoticComponent>; EmptyTip: ForwardRefExoticComponent<...>; FoundTip: ForwardRefExoticComponent<...>; ErrorTip: ForwardRefExoticComponent<...>; }' is not a valid JSX element type. [2023-06-06 11:12:51] 29 | <> [2023-06-06 11:12:51] 30 | <CommonHeader /> [2023-06-06 11:12:51] > 31 | <StatusTip style={{ position: 'absolute', ...loadingStyle, top: '45%' }} status="loading" /> [2023-06-06 11:12:51] | ^^^^^^^^^ [2023-06-06 11:12:51] 32 | </> [2023-06-06 11:12:51] 33 | ); [2023-06-06 11:12:51] 34 | } [2023-06-06 11:12:51]src/common/LazyLoading.tsx:36:13错误信息其实很明确，因为项目原来是好好的，在流水线中构建，突然出现的问题，肯定是构建环境问题，报错内容大概是说函数的返回值类型不能用作react组件，所以判断是ts的类型校验和我们原有项目的react版本不兼容，所以通过同步ts的版本和react的类型声明文件的版本解决yarn add -D @types/react@latest @types/react-dom@latest
