Это длинная история, но я работаю над приложением React и импортирую. js непосредственно из sr c пакета node_modules; Я знаю, что это не то, как предполагается использовать node_modules, но это то, что я должен сделать. В одном из файлов в node_modules есть эти строки
// @flow
/* eslint-disable no-restricted-syntax */
const isProduction: boolean = process.env.NODE_ENV === 'production';
const prefix: string = 'Invariant failed';
, которые вызывают ошибку Unexpected token во время компиляции приложения React.
1 | // @flow
2 | /* eslint-disable no-restricted-syntax */
> 3 | const isProduction: boolean = process.env.NODE_ENV === 'production';
| ^
Это не как :, но, и я новичок в eslint, я подумал, что комментарий eslint позаботится об этом. Если я изменю : на =, он будет работать нормально, но я не могу / не хочу менять этот файл, я просто хочу его использовать. Я установил eslint в директорию root моего приложения, но ничего не изменилось; Я попытался установить правила соответствующим образом, но все равно ничего.
Не думаю, что это имеет значение, но на всякий случай вот мой .eslintr c. js. Как я уже говорил, я новичок в eslint и не уверен в том, как все работает полностью, все здесь сгенерировано или я скопировал из модуля, файл которого я пытаюсь использовать.
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',
],
},
],
}
Любая помощь по этому вопросу будет быть высоко ценится. Заранее спасибо.