这是一个很长的故事,但是我正在开发一个React应用,并且正在直接从node_modules包的src导入.js。我知道这不是应该使用node_modules的方式,但这是我必须要做的。在node_modules中的文件之一中,有以下几行
// @flow
/* eslint-disable no-restricted-syntax */
const isProduction: boolean = process.env.NODE_ENV === 'production';
const prefix: string = 'Invariant failed';
这会导致在编译React应用期间引发Unexpected token
错误。
1 | // @flow
2 | /* eslint-disable no-restricted-syntax */
> 3 | const isProduction: boolean = process.env.NODE_ENV === 'production';
| ^
它不喜欢:
,但是,我对eslint陌生,我认为eslint注释可以解决这个问题。如果我将:
更改为=
,就可以了,但是我不能/不想更改此文件,我只想使用它。我已经在应用程序的根目录中设置了eslint,但没有任何更改。我尝试过相应地设置规则,但仍然没有。
我认为这并不重要,但以防万一,这是我的.eslintrc.js。就像我说的,我是新手,不能确定一切如何正常工作,这里的所有内容都是生成的,或者是我从要使用其文件的模块中复制的。
module.exports = {
"env": {
"browser": true,"es6": true
},"extends": [
"eslint:recommended","plugin:react/recommended"
],"globals": {
"Atomics": "readonly","SharedArrayBuffer": "readonly"
},"parserOptions": {
"ecmaFeatures": {
"jsx": true
},"ecmaVersion": 2018,"sourceType": "module"
},"plugins": [
"react"
],"rules": {
// Error on prettier violations
'prettier/prettier': 'error',// New eslint style rules that is not disabled by prettier:
'lines-between-class-members': 'off',// Allowing warning and error console logging
// use `invariant` and `warning`
'no-console': ['error'],// Opting out of prefer destructuring (nicer with flow in lots of cases)
'prefer-destructuring': 'off',// Disallowing the use of variables starting with `_` unless it called on `this`.
// Allowed: `this._secret = Symbol()`
// Not allowed: `const _secret = Symbol()`
'no-underscore-dangle': ['error',{ allowAfterThis: true }],// Cannot reassign function parameters but allowing modification
'no-param-reassign': ['error',{ props: false }],// Named exports are kewl
'import/prefer-default-export': 'off',// Don't tell me what to do!
'max-classes-per-file': 'off',// Allowing ++ on numbers
'no-plusplus': 'off',// Always enforcing the use of curly braces for if statements
curly: ['error','all'],'no-restricted-syntax': [
// nicer booleans #1
// Disabling the use of !! to cast to boolean
'error',{
selector:
'UnaryExpression[operator="!"] > UnaryExpression[operator="!"]',message:
'!! to cast to boolean relies on a double negative. Use Boolean() instead',},// nicer booleans #2
// Avoiding accidental `new Boolean()` calls
// (also covered by `no-new-wrappers` but i am having fun)
{
selector: 'NewExpression[callee.name="Boolean"]',message:
'Avoid using constructor: `new Boolean(value)` as it creates a Boolean object. Did you mean `Boolean(value)`?',// We are using a useLayoutEffect / useEffect switch to avoid SSR warnings for useLayoutEffect
// We want to ensure we use `import useEffect from '*use-isomorphic-layout-effect'`
// to ensure we still get the benefits of `eslint-plugin-react-hooks`
{
selector:
'ImportDeclaration[source.value=/use-isomorphic-layout-effect/] > ImportDefaultSpecifier[local.name!="useLayoutEffect"]',message:
'Must use `useLayoutEffect` as the name of the import from `*use-isomorphic-layout-effect` to leverage `eslint-plugin-react-hooks`',// No Array.from as it pulls in a large amount of babel helpers
{
selector: 'MemberExpression[object.name="Array"][property.name="from"]',message:
'Not allowing using of Array.from to save kbs. Please use native-with-fallback/from',// No usage of `tiny-invariant`. Must use our own invariant for error flow
{
selector: 'ImportDeclaration[source.value="tiny-invariant"]',message:
'Please use our own invariant function (src/invariant.js) to ensure correct error flow',// Must use invariant to throw
{
selector: 'ThrowStatement',message:
'Please use invariant (src/invariant.js) for throwing. This is to ensure correct error flows',],// Allowing Math.pow rather than forcing `**`
'no-restricted-properties': [
'off',{
object: 'Math',property: 'pow','no-restricted-imports': [
'error',{
paths: [
// Forcing use of useMemoOne
{
name: 'react',importNames: ['useMemo','useCallback'],message:
'`useMemo` and `useCallback` are subject to cache busting. Please use `useMemoOne`',// Forcing use aliased imports from useMemoOne
{
name: 'use-memo-one',importNames: ['useMemoOne','useCallbackOne'],message:
'use-memo-one exports `useMemo` and `useCallback` which work nicer with `eslint-plugin-react-hooks`',// Disabling using of useLayoutEffect from react
{
name: 'react',importNames: ['useLayoutEffect'],message:
'`useLayoutEffect` causes a warning in SSR. Use `useIsomorphicLayoutEffect`',// Allowing jsx in files with any file extension (old components have jsx but not the extension)
'react/jsx-filename-extension': 'off',// Not requiring default prop declarations all the time
'react/require-default-props': 'off',// Opt out of preferring stateless functions
'react/prefer-stateless-function': 'off',// Allowing files to have multiple components in it
'react/no-multi-comp': 'off',// Sometimes we use the PropTypes.object PropType for simplicity
'react/forbid-prop-types': 'off',// Allowing the non function setState approach
'react/no-access-state-in-setstate': 'off',// Opting out of this
'react/destructuring-assignment': 'off',// Adding 'skipShapeProps' as the rule has issues with correctly handling PropTypes.shape
'react/no-unused-prop-types': ['error',{ skipShapeProps: true }],// Having issues with this rule not working correctly
'react/default-props-match-prop-types': 'off',// Allowing functions to be passed as props
'react/jsx-no-bind': 'off',// Require // @flow at the top of files
'flowtype/require-valid-file-annotation': [
'error','always',{ annotationStyle: 'line' },// Allowing importing from dev deps (for stories and tests)
'import/no-extraneous-dependencies': 'off',// Enforce rules of hooks
'react-hooks/rules-of-hooks': 'error',// Second argument to hook functions
'react-hooks/exhaustive-deps': 'error','react/jsx-props-no-spreading': 'off',// using <React.Fragment> is fine
'react/jsx-fragments': 'off',// all good to declare static class members in the class
'react/static-property-placement': 'off',// don't need to initialize state in a constructor
'react/state-in-constructor': 'off','jest/expect-expect': [
'error',{
assertFunctionNames: [
'expect',// these functions will run expect internally
'withWarn','withError','withoutError','withoutWarn',}
在此方面的任何帮助将不胜感激。预先感谢。