Js-beautify: Baris baru dimasukkan setelah impor/ekspor modul ES6

Dibuat pada 9 Jan 2014  ·  54Komentar  ·  Sumber: beautify-web/js-beautify

Hai,

Saya menjalankan jsbeautifier pada kumpulan modul Ember.JS ES6 dan saya melihat ada masalah kecil dengan pernyataan ekspor.

Misalkan saya memiliki modul yang mengekspor seperti di bawah ini

export default DS.FixtureAdapter.extend();

jsbeautifier akan menambahkan baris baru setelah ekspor

export
default DS.FixtureAdapter.extend();

Ini adalah masalah kecil yang hanya menjadi masalah bagi kami karena kami menjalankan jsbeautifier sebelum komit diterima. Jadi, jika pengembang menghapus baris baru, file yang dimaksud akan disertakan dalam komit meskipun mungkin tidak ada hubungannya dengan perubahan yang dilakukan.

enhancement

Komentar yang paling membantu

@the-simian Opsi yang benar adalah "brace_style": "collapse-preserve-inline" , di bagian "Brace style" jika Anda melalui preferensi Atom. Opsi "preserve_newlines" adalah untuk mempertahankan baris baru di seluruh file. Anda pasti ingin yang itu benar. :)

Semua 54 komentar

Terkait dengan #388.

Saya pikir masalahnya di sini adalah kami tidak menangani ekspor sebagai kata yang dicadangkan.

Hei @bitwiseman itulah masalahnya, tetapi misalnya jika saya menulis sesuatu seperti

export default moduleName;

Itu akan dipercantik sebagai

default moduleName;

Yang tidak terlihat bagus :)

Plus, jika saya ingin impor gaya brace

import { mod1, mod2 } from 'filePath';

Itu akan dipercantik sebagai

import { 
  mod1, 
  mod2 
} from 'filePath';

Apa pendapatmu tentang itu ?

Semua ini terdengar baik-baik saja. Kata kunci module , export , dan import perlu ditambahkan dan kode ditulis untuk memformat dengan benar.

Adakah berita tentang seberapa dekat masalah ini akan diselesaikan?

Itu akan ada di rilis berikutnya. Infrastruktur sudah ada, harus ada perubahan kecil.

+1 untuk memperbaiki pemformatan pernyataan ekspor!

+1

+1

+1

+1

+1

+n. Saya pikir hanya masalah menambahkan kata kunci ini ke daftar kata-kata yang dipesan. Apakah itu benar?

edit: tidak. Saya mencoba menemukan di mana aturan baru itu, tetapi apakah terlalu banyak kode untuk mengambil risiko perubahan =/

:+1:

Sepertinya ini adalah usaha yang signifikan untuk melakukan ini dengan benar. Maaf teman-teman tapi saya harus menyepak bola ini ke rilis berikutnya.

Sebagai referensi:
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 -ekspor

Ini membuat kita semua:

Tapi kita semua harus ingat:

Itu benar sekali. :senyum:

Untuk itu Anda mendapatkan perbaikan berikut - input yang tidak masuk akal di bawah ini akan menghasilkan output yang identik dari beautifier. Sebagian besar skenario masih terlihat mengerikan, tetapi saya merasa dapat meretasnya dengan sedikit rasa sakit.

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:
Ada perbaikan yang terlihat?

Di waktu luang saya yang banyak... :senyum:

:+1:

+1

+1

Masalah asli telah diperbaiki di 1.5.2.

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

Saya ingin bantuan Anda.

Berikan contoh input, output aktual, dan output yang diinginkan sehingga saya dapat mengatasi masalah ini. Juga tunjukkan apakah keluaran sebenarnya hanya tidak diinginkan atau jika itu menyebabkan kesalahan sintaksis. Kesalahan sintaks akan mendapatkan prioritas. Saya punya satu sejauh ini dari @thaume -

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

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

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

CATATAN:

  • Silakan lihat komentar satu sama lain dan cobalah untuk tidak mengulangi kelas pemformatan dengan sedikit perbedaan. Upaya terbaik baik-baik saja. :senyum:
  • Penempatan penyangga akan menjadi masalah utama. Saat ini kami memiliki satu pengaturan untuk memposisikan semua jenis kawat gigi - menciutkan, memperluas,
  • Karena masalah asli telah diperbaiki, saya mungkin akan menutup masalah ini dan membuka yang baru untuk berbagai masukan yang Anda berikan.

@bitwiseman Sampel di atas persis seperti yang saya harapkan juga. Saya telah bermain dengan ES6 akhir-akhir ini di editor Atom, di mana saya tidak memiliki format otomatis saat disimpan, hanya karena impornya kacau.

Diharapkan/Masukan :

import { Bar } from 'lib/Bar';

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

export { Foo };

Bagaimana keadaannya sekarang:

import {
    Bar
}
from 'lib/Bar';

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

export {
    Foo
};

Saya belum tahu contoh yang akan memecahkan kode saat diformat.

Saya tahu ini bukan impor/ekspor, dan ini terkait dengan jsx, jadi ini mungkin binatang yang sama sekali berbeda, namun saya dapat membayangkan bahwa perbaikan akan terkait:

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

menjadi

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

Apakah Anda menetapkan e4x = true ?

Ya saya lakukan, dan saya dapat melihat di jsx biasa tanpa literal bahwa itu dihormati. Namun, memiliki literal seperti {...props} di tag terluar akan segera merusak pemformatan. Jika literal berada di dalam elemen bersarang, ia bekerja sedikit lebih baik tetapi masih rusak pada tag penutup. Saya dapat memposting lebih banyak contoh jika ini adalah tempat/masalah yang tepat.

@loopmode - Silakan buka masalah baru dengan contoh yang Anda miliki di atas.

+1

:+1: Ini juga mempengaruhi objek yang rusak.

var { type, size } = someObject;

diubah menjadi

var {
        type, size
    } = someObject;

:+1: impor dan pemformatan jsx rusak untuk saya juga saat menggunakan atom

+1

+1

+1

+1

Dengan js-beautify 1.5.10, saya mendapatkan yang berikut:

Memasukkan:

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

Keluaran:

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

Saya pasti tidak ingin baris baru setelah kurung kurawal akhir.

+1

Ada rencana untuk mendukung ini?

Apakah ini masih belum diperbaiki?

Hal ini masih terbuka. Permintaan tarik diterima.

+1

Meskipun ada solusi menggunakan:
/* mempercantik pelestarian: mulai _/
/_ mempercantik pelestarian:akhir */

Ini tidak terlalu bagus untuk dilihat.

+1

+1

+1

Bagi siapa pun yang tertarik, masalah yang tersisa adalah dengan import {x, y} from './other' . Ini tampaknya menjadi sub-kasus dari objek yang dirusak. Lihat #511.

Saya masih mendapatkan perilaku untuk impor, tetapi semua tiket ditutup. Bagaimana saya bisa mempertahankan satu baris dalam impor setelah kecantikan di Atom? Terima kasih!

Oke, yang diperlukan hanyalah menambahkan konfigurasi berikut di .jsbeautifyrc

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

Saya masih mengalami masalah ini dengan import . Saya menggunakan 1.6.3

import { mod1, mod2 } from 'filePath';

menjadi

import { 
  mod1, 
  mod2 
} from 'filePath';

bagi Anda yang berfungsi dengan benar, dapatkah Anda memposting file .rc json Anda dengan properti yang benar yang ditunjukkan? Saya tidak tahu mengapa itu tidak berfungsi sama sekali.

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

yang tidak memperbaikinya (seperti yang diposting di atas)

@the-simian Opsi yang benar adalah "brace_style": "collapse-preserve-inline" , di bagian "Brace style" jika Anda melalui preferensi Atom. Opsi "preserve_newlines" adalah untuk mempertahankan baris baru di seluruh file. Anda pasti ingin yang itu benar. :)

@eloquence terima kasih atas pembaruannya, saya akan mencobanya sesegera mungkin
Sunting: _Itu dia_

Berikut adalah konteks json yang berfungsi penuh di file .jsbeautifyrc:

{
    "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 Saya mendapat masalah yang sama dengan collapse-preserve-inline

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

Memasukkan:

const _state = { ...state }

Keluaran:

const _state = {...state }

Sementara collapse-preserve-inline berfungsi, tidak ada cara untuk mendapatkan perilaku yang sama dengan end-expand atau expand . Apakah ada cara agar kita bisa mendapatkan end-expand-preserve-inline dan serupa untuk opsi lain atau mungkin bahkan opsi preserve-inline-braces dengan benar atau salah?

@Coburn37 - Silakan ajukan masalah baru dan/atau lihat #1052 untuk melihat apakah itu menjelaskan apa yang Anda inginkan.

+1. Saya bukan penggemar keruntuhan, preserve-inline. Saya ingin menambahkan aturan khusus untuk impor...

Apakah halaman ini membantu?
0 / 5 - 0 peringkat