เหตุใด 'create-react-app' จึงให้ 2 ช่องว่างแทนการเยื้อง 4 ช่องเสมอ

ทุกครั้งที่ฉันเรียกใช้ 'create-react-app' โปรเจ็กต์ที่เตรียมใช้งานของฉันจะใช้ 2 แทนที่จะเป็น 4 ช่องว่างการเยื้อง วิธีแปลงเป็น 4 แท็บโดยอัตโนมัติ?

ฉันใช้ Atom เป็นโปรแกรมแก้ไขข้อความ ภายใต้ 'config.cson' ความยาวแท็บจะตั้งค่าเป็น 4 เสมอ


reactjs atom-editor indentation
person Community    schedule 29.03.2018    source แหล่งที่มา
comment
FWIW นั่นเป็นแนวทางปฏิบัติของ JS ในปัจจุบันไม่มากก็น้อยไม่ว่าจะดีขึ้นหรือแย่ลง เพียงเรียกใช้อุปกรณ์เสริมสวยที่คุณใช้และฟอร์แมตใหม่หากคุณยืนยันที่จะเยื้องใหญ่   -  person Dave Newton    schedule 30.03.2018
comment
นั่นเป็นข้อความที่กว้างมาก ฉันทำงานในบริษัทขนาดใหญ่บางแห่ง และทีมพัฒนาต่างก็ต้องการพื้นที่ 4 ช่องเพื่อให้อ่านง่าย   -  person Neil Guy Lindberg    schedule 13.07.2020

คำตอบ (3)


arrow_upward
4
arrow_downward

ไม่มีวิธีที่จะบอก create-react-app ให้เยื้องโดยใช้ช่องว่าง 4 ช่องแทนที่จะเป็น 2 ช่อง นี่คือสไตล์ที่ผู้สร้าง React ได้สร้างมาตรฐานขึ้นมา

สิ่งที่ดีที่สุดที่คุณสามารถทำได้คือทำการค้นหาทั่วโลกและแทนที่ไฟล์ต้นฉบับของคุณเป็นสองช่องว่างและแทนที่ด้วยช่องว่างสี่ช่อง

person Andrew Pearson    schedule 30.03.2018

arrow_upward
2
arrow_downward

ฉันเพิ่ม .eslintrc (ในโฟลเดอร์รูทของโปรเจ็กต์ แต่อาจอยู่ใน ./src เนื่องจากการตั้งค่า eslint ที่ใช้นั้นใกล้กับสิ่งที่กำลังเป็นขุย) โดยมีกฎต่อไปนี้ (ถูกเตือน - ตัวแยกวิเคราะห์เหล่านี้ กฎ /parserOption ดูเหมือนจะเปลี่ยนแปลงอย่างรวดเร็ว) https://eslint.org/docs/rules/indent

{
    "parser": "babel-eslint",
    "parserOptions": {
        "ecmaVersion": 2018,
        "sourceType": "module",
        "ecmaFeatures": {
            "jsx": true
        }
    },
    "rules": {
        "indent": ["error", 4, { "SwitchCase": 1 }]
    }
}

จากนั้นฉันก็รันด้วยคำสั่งนี้: eslint ./src/ --fix

โดยพื้นฐานแล้ว ฉันกำลังแทนที่การตั้งค่า eslint ที่ซ้อนกัน/ซ่อนไว้ซึ่ง create-react-app มาพร้อมกับเป็นค่าเริ่มต้น ฉันใช้ VSCode และพบว่าฉันต้องเปิดไฟล์อีกครั้งเพื่อให้การเปลี่ยนแปลงแสดง (ด้วยตัวช่วยแบบเห็นภาพที่ฉันใช้เหมือนคำแนะนำการเยื้อง)

หมายเหตุ: แก้ไขเพื่อเพิ่ม SwitchCase หากไม่มีสิ่งนี้ ณ วันนี้ กรณีต่างๆ จะไม่มีการเยื้องในคำสั่ง switch (มองเห็นได้ในคอลัมน์เดียวกับสวิตช์คำหลัก) ตามค่าเริ่มต้นของ create-react-app คุณสามารถปล่อยวัตถุพิเศษนั้นไว้ในอาร์เรย์เยื้องได้หากต้องการ

person Neil Guy Lindberg    schedule 13.07.2020
comment
ใช้งานไม่ได้ในขณะนี้ - Error: Cannot find module 'babel-eslint' - person milanHrabos; 10.07.2021

arrow_upward
1
arrow_downward

ไม่แน่ใจเกี่ยวกับ create-react-app โดยเฉพาะ แต่สิ่งนี้จะช่วยกำหนดค่าแอปการเยื้องของคุณให้กว้างขึ้น

http://editorconfig.org/

คุณสามารถเลือกตัวแก้ไขของคุณและทำการเปลี่ยนแปลงการกำหนดค่าที่จำเป็นในโปรเจ็กต์ของคุณ เพื่อรักษาระยะห่างทั่วไปและการระบุโปรเจ็กต์ให้กว้าง โดยไม่คำนึงว่าใครกำลังใช้ตัวแก้ไขตัวใดอยู่

person gia    schedule 30.03.2018