タグ付けされた質問 「eslint」

ReactのESLINTを事前構成することになっているeslint-config-airbnbをインストールしました。 デフォルトのエクスポートには、ECMAScript 6+とReactを含むすべてのESLintルールが含まれています。eslint、eslint-plugin-import、eslint-plugin-react、およびeslint-plugin-jsx-a11yが必要です。 私の.eslintrc構成を拡張します： { "extends": "eslint-config-airbnb", "env": { "browser": true, "node": true, "mocha": true }, "rules": { "new-cap": [2, { "capIsNewExceptions": ["List", "Map", "Set"] }], "react/no-multi-comp": 0, "import/default": 0, "import/no-duplicates": 0, "import/named": 0, "import/namespace": 0, "import/no-unresolved": 0, "import/no-named-as-default": 2, "comma-dangle": 0, // not sure why airbnb turned this on. …

102 javascript  reactjs  eslint  eslint-config-airbnb 

複数のjavascriptファイルがあり、他の前に読み込まれるファイルでいくつかのグローバル変数を定義しました。結果として、最初にロードされたすべてのファイルは、グローバル変数にアクセスできます。ただし、ESLintはグローバル変数を「未定義」として表示します。ESLintのルールを変更したくありません。これらのエラーメッセージを取り除くためのエレガントな方法を見つけたいと思います。どんな手掛かり？ありがとう

100 javascript  variables  global  eslint 

PrettierとESLintを一緒に使いたいのですが、次々と使うだけでコンフリクトが発生しました。タンデムで使用できるように見える次の3つのパッケージがあることがわかります。 prettier-eslint eslint-plugin-prettier eslint-config-prettier しかし、私はすべて含まれているこれらのパッケージ名として使用するか不明だeslintとprettier。 どちらを使うべきですか？

100 javascript  ecmascript-6  eslint  code-formatting  prettier 

DOMオブジェクトにプロパティを設定することを主な目的とするメソッドがあります function (el) { el.expando = {}; } ESLintにno-param-reassignエラーをスローさせるAirBnBのコードスタイルを使用します。 エラー関数パラメーター 'el'への割り当てno-param-reassign AirBnBのコードスタイルに準拠しながら、引数として渡されたDOMオブジェクトを操作するにはどうすればよいですか？ 誰かが別の問題/* eslint react/prop-types: 0 */を参照することを使用することを提案しましたが、私が間違っていない場合、これは反応には当てはまりますが、ネイティブDOM操作には当てはまりません。 また、コードスタイルを変更するのは正解ではないと思います。標準スタイルを使用する利点の1つは、プロジェクト間で一貫したコードがあり、ルールを自由に変更できることは、AirBnBのような主要なコードスタイルの誤用のように感じることだと思います。 参考までに、私はGitHubでAirBnBに質問しました。彼らは、問題＃766でこれらのケースに行く方法を彼らがどう思うかを尋ねました。

94 javascript  dom  eslint 

次のロジックを使用して、指定されたキーのi18n文字列を取得しています。 export function i18n(key) { if (entries.hasOwnProperty(key)) { return entries[key]; } else if (typeof (Canadarm) !== 'undefined') { try { throw Error(); } catch (e) { Canadarm.error(entries['dataBuildI18nString'] + key, e); } } return entries[key]; } プロジェクトでESLintを使用しています。次のエラーが発生します。 ターゲットオブジェクトからObject.prototypeメソッド 'hasOwnProperty'にアクセスしないでください。これは「no-prototype-builtins」エラーです。 このエラーを解決するためにコードを変更するにはどうすればよいですか？このルールを無効にしたくありません。

94 javascript  ecmascript-6  eslint 

セットアップしましたeslint＆eslint-plugin-react。 ESLintを実行すると、リンターはno-unused-varsReactコンポーネントごとにエラーを返します。 JSXまたはReact構文を使用していることを認識していないと思います。何か案は？ 例： app.js import React, { Component } from 'react'; import Header from './header.js'; export default class App extends Component { render() { return ( <div> <Header /> {this.props.children} </div> ); } } リンターエラー： /my_project/src/components/app.js 1:8 error 'React' is defined but never used no-unused-vars 2:8 error 'Header' is …

91 javascript  reactjs  jsx  eslint 

私はとを使用ReactしESLintていeslint-plugin-reactます。 私はしたい1つのファイルにルール。disableprop-types var React = require('react'); var Model = require('./ComponentModel'); var Component = React.createClass({ /* eslint-disable react/prop-types */ propTypes: Model.propTypes, /* eslint-enable react/prop-types */ render: function () { return ( <div className="component"> {this.props.title} </div> ); } });

88 reactjs  eslint 

Typescriptで作成したシンプルなNode / Expressアプリがあります。そしてeslintは私にエラーを与えます Missing file extension "ts" for "./lib/env" import/extensions これが私の.eslintrcファイルです { "extends": [ "airbnb", "plugin:@typescript-eslint/recommended", "prettier", "prettier/react", "plugin:import/errors", "plugin:import/warnings", "plugin:import/typescript" ], "parser": "@typescript-eslint/parser", "plugins": ["@typescript-eslint", "prettier", "import"], "settings": { "import/extensions": [".js", ".jsx", ".ts", ".tsx"], "import/parsers": { "@typescript-eslint/parser": [".ts", ".tsx"] }, "import/resolver": { "typescript": { "directory": "./tsconfig.json" }, "node": { …

33 node.js  typescript  eslint 

いくつかの状態が変化したときにあまりにも角のあるカスタムフックを作成しています。 配列で任意の状態を渡すことができるはずです。 import { useState, useEffect } from 'react' const useFlatListUpdate = (dependencies = []) => { const [toggle, setToggle] = useState(false) useEffect(() => { setToggle(t => !t) }, [...dependencies]) return toggle } export default useFlatListUpdate そしてそれはとして使用されるべきです const toggleFlatList = useFlatListUpdate([search, selectedField /*, anything */]) しかし、それは私に次の警告を与えます React Hook useEffectの依存配列には、spread要素があります。これは、正しい依存関係を渡したかどうかを静的に検証できないことを意味します。eslint（react-hooks / …

10 reactjs  react-native  eslint  react-hooks 

私のnextjsプロジェクトでは、jsconfig.json絶対インポートを簡単にするためにパスをマッピングしました { "compilerOptions": { "baseUrl": "./", "paths": { "@/*": ["./*"] }, "target": "es6", "module": "commonjs", "experimentalDecorators": true } } インポートパスは次のようになります import { VIEW } from '@/src/shared/constants'; 私のeslintrc.js設定は module.exports = { ... , settings: { "import/resolver": { alias: { extensions: [".js"], map: ["@", "."] } } } } 「@ / what …

9 javascript  webpack  babel  eslint 

ユーザーがToDoアイテムのリストを並べ替えられるようにしたい。ユーザーがドロップダウンリストから項目を選択すると、それが設定されますsortKeyの新しいバージョンを作成するであろうsetSortedTodos、とターントリガーでuseEffect、コールをsetSortedTodos。 以下の例は、私が望んでいるとおりに機能しますが、eslintは依存関係配列に追加todosするように求めています。そうするとuseEffect、無限ループが発生します（予想どおり）。 const [todos, setTodos] = useState([]); const [sortKey, setSortKey] = useState('title'); const setSortedTodos = useCallback((data) => { const cloned = data.slice(0); const sorted = cloned.sort((a, b) => { const v1 = a[sortKey].toLowerCase(); const v2 = b[sortKey].toLowerCase(); if (v1 < v2) { return -1; } if (v1 > v2) { …

9 javascript  reactjs  react-hooks  eslint