Js-beautify: ES6 모듈 가져오기/내보내기 후에 삽입된 개행

관련 #388.

여기서 문제는 내보내기를 예약어로 처리하지 않는다는 것입니다.

Hey @bitwiseman 그게 정확히 문제지만 예를 들어 다음과 같은 것을 작성하면

export default moduleName;

다음과 같이 아름답게 될 것입니다.

default moduleName;

잘 안보이네요 :)

또한 중괄호 스타일 가져오기를 원하면

import { mod1, mod2 } from 'filePath';

다음과 같이 아름답게 될 것입니다.

import { 
  mod1, 
  mod2 
} from 'filePath';

그것에 대해 어떻게 생각하세요?

이 모든 것이 잘 들립니다. module , export 및 import 키워드를 추가하고 코드를 올바른 형식으로 작성해야 합니다.

이 문제가 해결될 예정이라는 소식이 있습니까?

다음 릴리스에 있을 예정입니다. 기반 시설은 거기에 있습니다. 약간의 변경이 있어야 합니다.

내보내기 문의 형식 수정에 +1!

+1

+1

+1

+1

+1

+n. 예약어 목록에 이 키워드를 추가하기만 하면 된다고 생각합니다. 그 맞습니까?

편집: 아니요. 새 규칙이 어디에 있는지 찾으려고 했지만 변경을 감수하기에는 코드가 너무 많습니다 =/

:+1:

이를 올바르게 수행하기 위한 중요한 작업인 것 같습니다. 사람들에게 미안하지만 다음 릴리스에 이것을 펀트해야합니다.

참고로:
http://people.mozilla.org/~jorendorff/es6-draft.html#sec -modules
http://people.mozilla.org/~jorendorff/es6-draft.html#sec -imports
http://people.mozilla.org/~jorendorff/es6-draft.html#sec -exports

이것은 우리 모두를 만듭니다:

그러나 우리 모두는 다음을 기억해야 합니다.

그것은 정확히 맞습니다. : 스마일 :

이를 위해 다음 수정 사항을 얻을 수 있습니다. 아래의 무의미한 입력은 미화 장치에서 동일한 출력을 생성합니다. 대부분의 시나리오는 여전히 끔찍해 보이지만 최소한의 고통으로 해킹할 수 있다고 느꼈습니다.

module "a" {
    import odd from "Odd";
    export default function div(x, y) {}
    export function sum(x, y) {
        return x + y;
    }
    export var pi = 3.141593;
    export default moduleName;
    export *
}

:+1:
수정 사항이 있습니까?

내 풍부한 자유 시간에... :스마일:

:+1:

+1

+1

원래 문제는 1.5.2에서 수정되었습니다.

@redking , @dred9e , @Aluxian , @simplyianm , @pgilad , @webbushka , @fpauser , @Volox , @naomifeehanmoran , @darlanalves , @thaume -

당신의 도움이 필요합니다.

이 문제를 해결할 수 있도록 입력, 실제 출력 및 원하는 출력의 예를 제공하십시오. 또한 실제 출력이 바람직하지 않거나 구문 오류가 발생하는지 여부도 표시합니다. 구문 오류가 우선합니다. 나는 지금까지 @thaume 에서 하나를 가지고 있습니다 -

//input
import { mod1, mod2 } from 'filePath';

// actual output - non-breaking 
import { 
  mod1, 
  mod2 
} from 'filePath';

// desired output (unchanged)
import { mod1, mod2 } from 'filePath';

메모:

• 서로의 의견을 살펴보고 약간의 차이가 있는 서식 클래스를 반복하지 않도록 하세요. 최선의 노력은 괜찮습니다. :웃다:
• 버팀대 위치가 중요한 문제가 될 것입니다. 현재 모든 유형의 중괄호 배치에 대한 하나의 설정이 있습니다. 접기, 확장,
• 원래 문제가 수정되었으므로 이 문제를 종료하고 귀하가 제공한 다양한 입력에 대해 새 문제를 열 ​​수 있습니다.

@bitwiseman 위의 샘플도 정확히 제가 예상한 것입니다. 최근에 Atom 편집기에서 ES6을 사용하고 있습니다. 저장 시 자동 형식 지정 기능이 없습니다. 가져오기가 엉망이기 때문입니다.

예상/입력:

import { Bar } from 'lib/Bar';

class Foo {
    constructor() {
        this.bar = new Bar();
    }
}

export { Foo };

현재 상태:

import {
    Bar
}
from 'lib/Bar';

class Foo {
    constructor() {
        this.bar = new Bar();
    }
}

export {
    Foo
};

나는 아직 포맷할 때 코드를 깨뜨릴 예를 모른다.

나는 이것이 가져오기/내보내기가 아니라 jsx와 관련이 있다는 것을 알고 있으므로 아마도 완전히 다른 짐승일 것입니다. 그러나 수정 사항이 관련될 것이라고 상상할 수 있습니다.

return <div {...props}></div>;

된다

return <div {...props
    } > < /div>;

e4x = true 을 설정하셨습니까?

예, 저는 리터럴 없이 일반 jsx에서 그것이 존중되고 있음을 볼 수 있습니다. 그러나 가장 바깥쪽 태그에 {...props}와 같은 리터럴이 있으면 서식이 즉시 중단됩니다. 리터럴이 중첩 요소 내부에 있으면 약간 더 잘 작동하지만 여전히 닫는 태그에서 중단됩니다. 이것이 올바른 장소/문제라면 더 많은 예를 게시할 수 있습니다.

@loopmode - 위의 예를 사용하여 새 문제를 여십시오.

+1

:+1: 이것은 또한 객체를 구조화하는 데 영향을 줍니다.

var { type, size } = someObject;

로 변환됩니다

var {
        type, size
    } = someObject;

:+1: 원자를 사용할 때도 가져오기 및 jsx 형식이 손상되었습니다.

+1

+1

+1

+1

js-beautify 1.5.10을 사용하면 다음이 표시됩니다.

입력:

import { x, y, z } from './other';

산출:

import {
    x, y, z
}
from './other';

나는 종결 중괄호 다음에 개행을 원하지 않습니다.

+1

이를 지원할 계획이 있습니까?

이거 아직도 안 고쳐졌나요?

아직 열려 있습니다. 풀 리퀘스트를 환영합니다.

+1

다음을 사용하는 해결 방법이 있지만:
/* 보존을 아름답게 하기:시작 _/
// 아름답게 보존:종료 */

이것은 보기에 별로 좋지 않습니다.

+1

+1

+1

관심 있는 사람을 위해 나머지 문제는 import {x, y} from './other' 입니다. 이것은 구조화되지 않은 개체의 하위 사례인 것 같습니다. #511 참조.

여전히 수입품에 대한 동작이 표시되지만 모든 티켓이 닫힙니다. Atom에서 미화한 후 가져오기에서 한 줄을 유지하려면 어떻게 해야 합니까? 감사 해요!

알겠습니다. .jsbeautifyrc에 다음 구성을 추가하기만 하면 됩니다.

{
  "preserve_newlines": true,
  "max_preserve_newlines": 2
}

import 에서 이 문제가 계속 발생하고 있습니다. 1.6.3 를 사용하고 있습니다.

import { mod1, mod2 } from 'filePath';

된다

import { 
  mod1, 
  mod2 
} from 'filePath';

올바르게 작동하는 사람들을 위해 올바른 속성이 지적된 .rc 파일 json을 게시할 수 있습니까? 나는 그것이 왜 전혀 작동하지 않는지 전혀 모른다.

{
  "preserve_newlines": true,
  "max_preserve_newlines": 2
}

그것은 그것을 수정하지 않았습니다 (위에 게시 된대로)

@the-simian Atom 환경 설정을 통해 이동하는 경우 올바른 옵션은 "Brace style" 섹션의 "brace_style": "collapse-preserve-inline" 입니다. "preserve_newlines" 옵션은 전체 파일에서 줄 바꿈을 보존하기 위한 것입니다. 하지만 당신은 분명히 그것이 사실이기를 원합니다. :)

@eloquence 업데이트 감사합니다. 최대한 빨리 시도해 보겠습니다.
편집: _그랬어요_

다음은 .jsbeautifyrc 파일의 컨텍스트 전체 작업 json입니다.

{
    "brace_style": "collapse-preserve-inline", //<----that
    "break_chained_methods": false,
    "end_with_newline": false,
    "eol": "\n",
    "eval_code": false,
    "indent_char": "  ",
    "indent_level": 0,
    "indent_size": 1,
    "indent_with_tabs": true,
    "jslint_happy": false,
    "keep_array_indentation": false,
    "keep_function_indentation": false,
    "max_preserve_newlines": 4, //<---this
    "preserve_newlines": true, // <---this too
    "space_after_anon_function": false,
    "space_before_conditional": true,
    "unescape_strings": false,
    "wrap_attributes": "auto",
    "wrap_attributes_indent_size": 2,
    "wrap_line_length": 0
}

@loopmode collapse-preserve-inline 와 비슷한 문제가 있습니다.

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

입력:

const _state = { ...state }

산출:

const _state = {...state }

collapse-preserve-inline 가 작동하는 동안 $ end-expand 또는 expand 로 동일한 동작을 얻을 수 있는 방법은 없습니다. 다른 옵션에 대해 end-expand-preserve-inline 및 유사하거나 true 또는 false가 있는 preserve-inline-braces 옵션을 얻을 수 있는 방법이 있습니까?

@Coburn37 - 새 문제를 제출하거나 #1052를 참조하여 원하는 내용을 설명하는지 확인하세요.

+1. 나는 붕괴, 보존 인라인의 팬이 아닙니다. 특히 수입에 대한 규칙을 추가하고 싶습니다...