より美しく設定する方法

爱喝马黛茶的安东尼
リリース: 2020-01-14 09:22:49
オリジナル
4064 人が閲覧しました

より美しく設定する方法

##Prettier とは ##Prettier は、JS/JSX/TS/Flow/JSON/CSS/LESS などのファイル形式をサポートできるコード整形ツールです。

Prettier を使用して lint の一部のシナリオ (セミコロン/タブ インデント/スペース/引用符など) を置き換える理由。これらは変更する必要があります。 lint ツールが問題を検出した後、手動でエラーを生成します。通常、このようなエラーはスペースや記号であり、比較的洗練されていません。書式設定ツールを使用してエラーを自動的に生成すると、時間と労力を節約できます。

構成をカスタマイズする方法

Prettier には一連のデフォルト構成が用意されているため、独自のコードに準拠するように構成項目を変更する方法

(1) .prettierrc ファイル (2) prettier.config.js ファイル

(3) prettier 属性をpackage.json

Prettier は構成ファイルをチェックし、ファイル内の構成を自動的に読み取ります。構成する方法を 1 つ選択するだけで済みます。現在、2 番目の方法を選択しています。

これは lint ツールと非常に似た感じですよね?

構成可能なプロパティ

構成ファイルを共有

module.exports = {
// tab缩进大小,默认为2
tabWidth: 2,
// 使用tab缩进,默认false
useTabs: true,
// 使用分号, 默认true
semi: false,
// 使用单引号, 默认false(在jsx中配置无效, 默认都是双引号)
singleQuote: true,
// 行尾逗号,默认none,可选 none|es5|all
// es5 包括es5中的数组、对象
// all 包括函数对象等所有可选
TrailingCooma: "none",
// 对象中的空格 默认true
// true: { foo: bar }
// false: {foo: bar}
bracketSpacing: true,
// JSX标签闭合位置 默认false
// false: <div
//          className=""
//          style={{}}
//       >
// true: <div
//          className=""
//          style={{}} >
jsxBracketSameLine:false,
// 箭头函数参数括号 默认avoid 可选 avoid| always
// avoid 能省略括号的时候就省略 例如x => x
// always 总是有括号
arrowParens: &#39;always&#39;,
}
ログイン後にコピー
MoreFAQ、PHP にアクセスしてください。中国語のウェブサイト。

以上がより美しく設定する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート