Prettier on demand, on run, on save
JSLab feature notes: one docs page, explained. Today: Formatting. Scratch code is written fast and formatted never. JSLab, a JavaScript & TypeScript scratchpad for macOS, formats with Prettier, so the mess you typed at speed can look like code before you paste it anywhere. On demand ⌥⇧F (Format Code) formats the current tab. It's also in Actions → Format Code and the command palette. const order={id:42,items:[{sku:"A-1",qty:2},{sku:"B-7",qty:1}],paid:true} const total=order.items.reduce((sum,item)=>sum+item.qty,0) total One ⌥⇧F later: const order = { id: 42, items: [ { sku: "A-1", qty: 2 }, { sku: "B-7", qty: 1 }, ], paid: true, }; const total = order.items.reduce((sum, item) => sum + item.qty, 0); total; The format lands as one undo step, and JSLab applies minimal edits instead of replacing the whole buffer, so your folds, scroll position and cursor stay where they were. On run, on save Two settings, both off by default: Format on Run (Settings → General) formats before each run, unless you're typing. Format on Save (Settings → Editor) formats when you save a file. The options Settings → Formatting holds every Prettier option JSLab supports, with Prettier's usual defaults: Setting Default Print Width 80 Tab Width 2 Semicolons On Single Quotes Off Trailing Commas All Arrow Parens Always Plus Use Tabs, Quote Props, JSX Single Quotes, Bracket Spacing and Bracket Same Line. Print Width goes from 20 to 320, and Tab Width from 1 to 16. When it can't parse If Prettier can't parse the tab, the status bar says Couldn't format, with Prettier's message, and your code is left as it was. A format that takes too long is stopped and the formatter restarts, so a giant paste can't hang the editor. JSLab launches Nov 15. The full page: https://js-lab.app/docs/formatting
This is a summary aggregated from Dev.to. Read the complete article on the original site:
Read full article at Dev.to