防止Atom Beautify自动格式化es6导入/对象解构(反应)

时间:2018-11-17 19:14:03

标签: javascript ecmascript-6 atom-editor js-beautify atom-beautify

我正在使用es6 import语句在React的项目中的原子文本编辑器中工作,并尝试使用atom-beautify(0.33.4)格式化我的代码。我的一个文件的开头如下:

import React, { Component } from 'react';
import { connect } from 'react-redux';
import { Link } from 'react-router-dom';
import axios from 'axios';

import { updateUser, updateUserLocation } from '../redux/reducers/user';

class Form extends Component {
  constructor(props) {
    super(props)
    this.state = {
      submitEnabled: false,
      lat: '',
      long: '',
      zip: '',
      city: '',
      state: '',
    }
  }

  validateName = (e) => {
    e.preventDefault();
    const { name, value } = e.target;
    const nameRegExp = /^[A-Za-zÀ-ÿ ,.'-]+$/;

    if (nameRegExp.test(value)) this.validInput(e)
    else this.invalidInput(name);
  }

当前,如果我使用键盘映射或以其他方式自动设置代码格式,它会显示:

1    import React, {
2      Component
3    } from 'react';
4    import {
5      connect
6    } from 'react-redux';
7    import {
8      Link
9    } from 'react-router-dom';
10   import axios from 'axios';
11
12   import {
13     updateUser,
14     updateUserLocation
15   } from '../redux/reducers/user';
16
17   class Form extends Component {
18     constructor(props) {
19       super(props)
20       this.state = {
21         submitEnabled: false,
22         lat: '',
23         long: '',
24         zip: '',
25         city: '',
26         state: '',
27       }
28     }
29
30     validateName = (e) => {
31       e.preventDefault();
32       const {
33         name,
34         value
35       } = e.target;
36       const nameRegExp = /^[A-Za-zÀ-ÿ ,.'-]+$/;
37       if (nameRegExp.test(value)) this.validInput(e)
38       else this.invalidInput(name);
39     }

有没有一种方法可以禁止对es6导入语句(预格式化的代码段的1-4行)和es6对象解构(预格式化的代码段的23行)进行自动格式化的原子美化。

在此先感谢您的答复。

1 个答案:

答案 0 :(得分:0)

如果您使用js-beautify作为基础引擎,请将brace-style设置为collapse,preserve-inline。这是等效的Atom UI:

Brace style: collapse-preserve-inline

您可以使用以下UI设置在beautifier.io上进行尝试:

Brace style: keep with control statement, Preserve inline braces

您也可以通过在“其他设置”中使用以下内容覆盖UI设置来实现此目的:

{
    "brace_style": "collapse,preserve-inline"
}