我已经使用带有expo init
的Expo CLI创建了一个基本的JavaScript Expo项目,选择了工作流程简单的TypeScript项目,并且希望使用WebStorm IDE的支持功能来施加严格的类型检查规则。但是,我是JavaScript的新手(它是广泛的选项和工具生态系统),也不清楚如何实现此目标。
例如,虽然我没有做任何进一步的配置来配置linting,但是我被警告这里的返回类型不兼容
我仍然看不到将项目配置为要求声明返回类型的方法,因此即使Expo documentation表示此配置应该是我所需要的,使用“ TypeScript与Expo。
"@typescript-eslint/parser": "^1.13.0",
"@typescript-eslint/eslint-plugin": "^1.13.0"
到我的project.json
,然后根据需要在.eslintrc
或perhaps better的.eslintrc.js
中进行配置,例如
module.exports = {
parser: '@typescript-eslint/parser', // Specifies the ESLint parser
extends: [
'plugin:react/recommended', // Uses the recommended rules from @eslint-plugin-react
'plugin:@typescript-eslint/recommended', // Uses the recommended rules from @typescript-eslint/eslint-plugin
],
parserOptions: {
ecmaVersion: 2018, // 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
},
},
rules: {
// Place to specify ESLint rules. Can be used to overwrite rules specified from the extended configs
// e.g. "@typescript-eslint/explicit-function-return-type": "off",
},
settings: {
react: {
version: 'detect', // Tells eslint-plugin-react to automatically detect the version of React to use
},
},
};
但这不会产生任何效果。
如何配置Expo TypeScript项目,以便可以配置TypeScript棉绒?
Expo CLI创建以下可能相关的文件。 (我对这些功能的不了解以及它们是否对棉绒和TypeScript有任何影响可能是问题的一部分。)
.babelrc
{
"presets": ["module:metro-react-native-babel-preset"]
}
.babel.config.js
module.exports = function(api) {
api.cache(true);
return {
presets: ['babel-preset-expo'],
};
};
tsconfig.json
{
"compilerOptions": {
"allowSyntheticDefaultImports": true,
"jsx": "react-native",
"lib": ["dom", "esnext"],
"moduleResolution": "node",
"noEmit": true,
"skipLibCheck": true,
"resolveJsonModule": true
}
}
package.json
{
"scripts": {
"android": "react-native run-android",
"ios": "react-native run-ios",
"web": "expo start --web",
"start": "react-native start",
"test": "jest"
},
"dependencies": {
"expo": "^34.0.1",
"react": "16.8.3",
"react-dom": "^16.8.6",
"react-native-web": "^0.11.4",
"react-native": "0.59.8",
"react-native-gesture-handler": "~1.3.0",
"react-native-reanimated": "~1.1.0",
"react-native-unimodules": "~0.5.2"
},
"devDependencies": {
"@babel/core": "^7.0.0",
"@types/react": "^16.8.23",
"@types/react-native": "^0.57.65",
"babel-preset-expo": "^6.0.0",
"jest-expo": "^34.0.0",
"typescript": "^3.4.5"
},
"jest": {
"preset": "react-native"
},
"private": true
}