【问题标题】:Proper ES6 Import Indentation正确的 ES6 导入缩进
【发布时间】:2017-05-27 15:07:23
【问题描述】:

我应该如何正确缩进一个非常大的 es6 import 语句? 是否有任何最佳实践/风格指南?

import { checkOldPassword, changeAddress, insertAddress, deleteAddress, changeEmail, changePassword, getCountries } from '../../actions/userActions.js'

我已经通过 AirBnb 样式指南研究了 react,但它似乎并没有解决问题。

【问题讨论】:

    标签: reactjs ecmascript-6 redux


    【解决方案1】:

    我通常总是使用尾随逗号,就像用于多行对象、数组和解构一样,例如

    import { 
        checkOldPassword, 
        changeAddress, 
        insertAddress, 
        deleteAddress, 
        changeEmail, 
        changePassword, 
        getCountries,
    } from '../../actions/userActions.js';
    

    这也是in the AirBnB style guide 定义的格式。

    【讨论】:

    • 接受,因为您提供了对样式指南的参考;) 非常感谢。
    • getCountries 后面真的要逗号吗?
    • @Sulthan 一些风格指南(如 airbnb)推荐它,因为它会导致更清晰的git 差异,就像您想添加新的导入一样。这两种方式都不是什么大问题。
    • @saadq 谢谢,现在我明白了原因。我实际上认为尾随逗号是非法的,但显然情况并非如此。
    • JS 越来越倾向于允许尾随逗号。自 ES5 以来,对象和数组的尾随逗号已被允许,ES6 的名称模块列表也允许它们,ES8 将包括函数调用和参数列表的尾随逗号。
    【解决方案2】:

    您可以为每一行使用新行,而不是全部写在一行中,如下所示:

    import { 
        checkOldPassword, 
        changeAddress, 
        insertAddress, 
        deleteAddress, 
        changeEmail, 
        changePassword, 
        getCountries } from '../../actions/userActions.js';
    

    Check this.

    我认为这就是你想要的,如果它不能回答你的问题,请告诉我。

    【讨论】:

      【解决方案3】:

      对于这种情况,我更喜欢“榆树风格”的缩进:

      import { checkOldPassword
          , changeAddress
          , insertAddress, 
          , deleteAddress
          , changeEmail
          , changePassword 
          , getCountries 
      } from '../../actions/userActions.js'
      

      乍一看可能看起来很奇怪,但很酷 - 它允许使用编辑器的 add row / remove row 命令添加/删除导入的属性。我是 Vim 用户,发现这非常方便。

      【讨论】:

      • 并非如此,它只是将缺少的逗号从末尾移到开头。
      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2015-05-30
      • 2019-02-02
      • 2018-02-23
      • 1970-01-01
      • 1970-01-01
      • 2018-01-04
      • 2018-06-01
      相关资源
      最近更新 更多