livecode-static/docs/assets/js/0eb8b304.6c7c1008.js

"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([["9259"],{5862:function(e,o,n){n.r(o),n.d(o,{default:()=>h,frontMatter:()=>s,metadata:()=>r,assets:()=>c,toc:()=>d,contentTitle:()=>a});var r=JSON.parse('{"id":"features/code-format","title":"Code Format","description":"Code formatting is supported for most languages.","source":"@site/docs/features/code-format.mdx","sourceDirName":"features","slug":"/features/code-format","permalink":"/docs/features/code-format","draft":false,"unlisted":false,"editUrl":"https://github.com/live-codes/livecodes/tree/develop/docs/docs/features/code-format.mdx","tags":[],"version":"current","frontMatter":{},"sidebar":"docsSidebar","previous":{"title":"AI Code Assistant \uD83E\uDE84","permalink":"/docs/features/ai"},"next":{"title":"Command Menu","permalink":"/docs/features/command-menu"}}'),t=n("5893"),i=n("65");let s={},a="Code Format",c={},d=[{value:"Code Formatters",id:"code-formatters",level:2},{value:"Format Button",id:"format-button",level:2},{value:"Keyboard Shortcut",id:"keyboard-shortcut",level:2},{value:"Format on-save",id:"format-on-save",level:2},{value:"Format Options",id:"format-options",level:2},{value:"Configuration",id:"configuration",level:2},{value:"SDK Method: <code>format</code>",id:"sdk-method-format",level:2}];function l(e){let o={a:"a",code:"code",h1:"h1",h2:"h2",header:"header",img:"img",li:"li",p:"p",ul:"ul",...(0,i.a)(),...e.components};return(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)(o.header,{children:(0,t.jsx)(o.h1,{id:"code-format",children:"Code Format"})}),"\n",(0,t.jsxs)(o.p,{children:["Code formatting is supported for most ",(0,t.jsx)(o.a,{href:"/docs/languages/",children:"languages"}),"."]}),"\n",(0,t.jsx)(o.h2,{id:"code-formatters",children:"Code Formatters"}),"\n",(0,t.jsxs)(o.p,{children:["The code formatter used for each language is specified in the ",(0,t.jsx)(o.a,{href:"/docs/languages/",children:"language documentation"})," page."]}),"\n",(0,t.jsx)(o.p,{children:"For example:"}),"\n",(0,t.jsxs)(o.ul,{children:["\n",(0,t.jsxs)(o.li,{children:[(0,t.jsx)(o.a,{href:"https://prettier.io/",children:"Prettier"})," is used for many languages including HTML, CSS, JavaScript, TypeScript, JSX, TSX."]}),"\n",(0,t.jsxs)(o.li,{children:[(0,t.jsx)(o.a,{href:"https://pkg.go.dev/cmd/gofmt",children:"gofmt"})," (via ",(0,t.jsx)(o.a,{href:"https://github.com/gopherjs/gopherjs",children:"GopherJS"}),") is used for Go."]}),"\n",(0,t.jsxs)(o.li,{children:[(0,t.jsx)(o.a,{href:"https://shaunlebron.github.io/parinfer/",children:"Parinfer"})," is used for Scheme, Common Lisp and ClojureScript."]}),"\n"]}),"\n",(0,t.jsx)(o.h2,{id:"format-button",children:"Format Button"}),"\n",(0,t.jsxs)(o.p,{children:["Code formatting for the code in the active editor can be triggered by the ",(0,t.jsx)(o.code,{children:"Format"})," button below the editor."]}),"\n",(0,t.jsx)(o.p,{children:(0,t.jsx)(o.img,{alt:"code format",src:n(8181).Z+"",width:"2240",height:"1400"})}),"\n",(0,t.jsx)(o.h2,{id:"keyboard-shortcut",children:"Keyboard Shortcut"}),"\n",(0,t.jsxs)(o.p,{children:["Code formatting can also be trigger by the keyboard shortcut ",(0,t.jsx)("kbd",{children:"Alt"})," + ",(0,t.jsx)("kbd",{children:"Shift"})," + ",(0,t.jsx)("kbd",{children:"F"}),"."]}),"\n",(0,t.jsx)(o.h2,{id:"format-on-save",children:"Format on-save"}),"\n",(0,t.jsx)(o.p,{children:"Format on-save can be enabled from the Settings menu \u2192 Format on-save."}),"\n",(0,t.jsx)(o.h2,{id:"format-options",children:"Format Options"}),"\n",(0,t.jsxs)(o.p,{children:["Some format options can be configured from ",(0,t.jsx)(o.a,{href:"/docs/features/editor-settings",children:"Editor Settings"})," screen. These include ",(0,t.jsx)(o.a,{href:"https://prettier.io/",children:"Prettier"})," ",(0,t.jsx)(o.a,{href:"https://prettier.io/docs/en/options.html",children:"configuration options"})," for:"]}),"\n",(0,t.jsxs)(o.ul,{children:["\n",(0,t.jsx)(o.li,{children:"Indentation (Spaces/Tabs)"}),"\n",(0,t.jsx)(o.li,{children:"Tab size"}),"\n",(0,t.jsx)(o.li,{children:"Use Semicolons"}),"\n",(0,t.jsx)(o.li,{children:"Use Single Quotes"}),"\n",(0,t.jsx)(o.li,{children:"Use Trailing Commas"}),"\n"]}),"\n",(0,t.jsx)(o.h2,{id:"configuration",children:"Configuration"}),"\n",(0,t.jsxs)(o.p,{children:["Code format can be configured using the ",(0,t.jsx)(o.a,{href:"/docs/configuration/configuration-object",children:"configuration object"})," properties:"]}),"\n",(0,t.jsxs)(o.ul,{children:["\n",(0,t.jsx)(o.li,{children:(0,t.jsx)(o.a,{href:"/docs/configuration/configuration-object#formatonsave",children:(0,t.jsx)(o.code,{children:"formatOnsave"})})}),"\n",(0,t.jsx)(o.li,{children:(0,t.jsx)(o.a,{href:"/docs/configuration/configuration-object#usetabs",children:(0,t.jsx)(o.code,{children:"useTabs"})})}),"\n",(0,t.jsx)(o.li,{children:(0,t.jsx)(o.a,{href:"/docs/configuration/configuration-object#tabsize",children:(0,t.jsx)(o.code,{children:"tabSize"})})}),"\n",(0,t.jsx)(o.li,{children:(0,t.jsx)(o.a,{href:"/docs/configuration/configuration-object#semicolons",children:(0,t.jsx)(o.code,{children:"semicolons"})})}),"\n",(0,t.jsx)(o.li,{children:(0,t.jsx)(o.a,{href:"/docs/configuration/configuration-object#singlequote",children:(0,t.jsx)(o.code,{children:"singleQuote"})})}),"\n",(0,t.jsx)(o.li,{children:(0,t.jsx)(o.a,{href:"/docs/configuration/configuration-object#trailingcomma",children:(0,t.jsx)(o.code,{children:"trailingComma"})})}),"\n"]}),"\n",(0,t.jsxs)(o.h2,{id:"sdk-method-format",children:["SDK Method: ",(0,t.jsx)(o.code,{children:"format"})]}),"\n",(0,t.jsxs)(o.p,{children:["The code format can be programmatically triggered by the ",(0,t.jsx)(o.a,{href:"/docs/sdk/",children:"SDK"})," method ",(0,t.jsx)(o.a,{href:"/docs/sdk/js-ts#format",children:(0,t.jsx)(o.code,{children:"format"})}),"."]})]})}function h(e={}){let{wrapper:o}={...(0,i.a)(),...e.components};return o?(0,t.jsx)(o,{...e,children:(0,t.jsx)(l,{...e})}):l(e)}},8181:function(e,o,n){n.d(o,{Z:function(){return r}});let r=n.p+"assets/images/format-1-caf806af001854376b50db95f544bdf0.jpg"},65:function(e,o,n){n.d(o,{Z:function(){return a},a:function(){return s}});var r=n(7294);let t={},i=r.createContext(t);function s(e){let o=r.useContext(i);return r.useMemo(function(){return"function"==typeof e?e(o):{...o,...e}},[o,e])}function a(e){let o;return o=e.disableParentContext?"function"==typeof e.components?e.components(t):e.components||t:s(e.components),r.createElement(i.Provider,{value:o},e.children)}}}]);