{"id":15150,"date":"2024-03-31T18:56:41","date_gmt":"2024-03-31T15:26:41","guid":{"rendered":"https:\/\/www.itpiran.net\/blog\/?p=15150"},"modified":"2024-03-31T18:56:41","modified_gmt":"2024-03-31T15:26:41","slug":"how-to-format-code-with-prettier-in-visual-studio-code","status":"publish","type":"post","link":"https:\/\/www.itpiran.net\/blog\/es\/tutorials\/how-to-format-code-with-prettier-in-visual-studio-code\/","title":{"rendered":"C\u00f3mo formatear c\u00f3digo con Prettier en Visual Studio Code"},"content":{"rendered":"

Introducci\u00f3n<\/h2>\n

Formatear c\u00f3digo siempre es un desaf\u00edo, pero las herramientas modernas para desarrolladores permiten mantener autom\u00e1ticamente la coherencia en el c\u00f3digo base de tu equipo. En este art\u00edculo, configurar\u00e1s Prettier para formatear autom\u00e1ticamente tu c\u00f3digo en Visual Studio Code, tambi\u00e9n conocido como VS Code.<\/p>\n

Para fines de demostraci\u00f3n, aqu\u00ed hay un ejemplo del c\u00f3digo que est\u00e1 formateando:<\/p>\n

\n
const name = \"James\";\r\nconst person ={first: name\r\n}\r\nconsole.log(person);\r\nconst sayHelloLinting = (fName) => {\r\nconsole.log(`Hello linting, ${fName}`)\r\n}\r\nsayHelloLinting('James');<\/code><\/pre>\n<\/div>\n
Si est\u00e1 familiarizado con el formato de c\u00f3digo, es posible que observe algunos pasos incorrectos:<\/p>\n
    \n
  • Una combinaci\u00f3n de comillas simples y dobles.<\/li>\n
  • La primera propiedad del objeto Persona debe estar en su l\u00ednea.<\/li>\n
  • La declaraci\u00f3n de la consola dentro de la funci\u00f3n debe estar sangrada.<\/li>\n
  • Es posible que le gusten o no los par\u00e9ntesis opcionales alrededor del par\u00e1metro de funci\u00f3n de flecha.<\/li>\n<\/ul>\n
    Requisitos previos<\/h5>\n
      \n
    • Descargue e instale Visual Studio Code.<\/li>\n
    • Para usar Prettier en Visual Studio Code, necesita instalar el complemento. Para ello, busque Prettier \u2013 Code Formatter en el panel de complementos de VS Code. Si es la primera vez que lo instala, ver\u00e1 el bot\u00f3n Instalar en lugar del bot\u00f3n Desinstalar que se muestra aqu\u00ed:<\/li>\n<\/ul>\n
      \"\"
      \nPaso 1 \u2013 Uso del comando Formato de documento<\/h2>\n
      Con el complemento Prettier instalado, ya puedes usarlo para formatear tu c\u00f3digo. Para empezar, exploremos el uso del comando "Formatear Documento". Este comando mejora la coherencia del c\u00f3digo con el espaciado formateado, el ajuste de l\u00ednea y las comillas.<\/p>\n
      Para abrir la paleta de comandos, puede utilizar COMANDO + MAY\u00daS + P<\/code> En macOS o CTRL + MAY\u00daS + P<\/code> Usar en Windows.<\/p>\n
      En la paleta de comandos, busque Formato y luego Formato del documento<\/code> Seleccionar.<\/p>\n
      \"\"
      \nEs posible que se le pida que seleccione el formato. Para ello, haga clic en el bot\u00f3n Configurar.<\/p>\n
      \"\"
      \nA continuaci\u00f3n, seleccione Prettier \u2013 Code Formatter.<\/p>\n
      \"\"
      \nSu c\u00f3digo ahora est\u00e1 formateado con espaciado, ajuste de l\u00ednea y comillas fijas:<\/p>\n
      \n
      const name = \"James\";\r\nconst person = { first: name };\r\nconsole.log(person);\r\nconst sayHelloLinting = (fName) => {\r\nconsole.log(`Hello linting, ${fName}`);\r\n};\r\nsayHelloLinting(\"James\");<\/code><\/pre>\n<\/div>\n
      Esto tambi\u00e9n funciona con archivos CSS. Puedes convertir texto con sangr\u00edas, par\u00e9ntesis, saltos de l\u00ednea y punto y coma inconsistentes en c\u00f3digo con el formato correcto. Por ejemplo:<\/p>\n
      \n
      body {color: red;\r\n}\r\nh1 {\r\ncolor: purple;\r\nfont-size: 24px\r\n}<\/code><\/pre>\n<\/div>\n
      Tiene el siguiente formato:<\/p>\n
      \n
      body {\r\ncolor: red;\r\n}\r\nh1 {\r\ncolor: purple;\r\nfont-size: 24px;\r\n}<\/code><\/pre>\n<\/div>\n
      Ahora que hemos revisado este comando, veamos c\u00f3mo podemos hacer que se ejecute autom\u00e1ticamente.<\/p>\n
      Paso 2 \u2013 Formatear el c\u00f3digo al guardar<\/h2>\n
      Hasta ahora, ten\u00edas que ejecutar manualmente un comando para formatear tu c\u00f3digo. Para automatizar este proceso, puedes configurar VS Code para formatear autom\u00e1ticamente tus archivos al guardar. Esto tambi\u00e9n garantiza que no se registre c\u00f3digo sin formato en el control de versiones.<\/p>\n
      Para cambiar esta configuraci\u00f3n, COMANDO +<\/code> en macOS o CTRL +<\/code> Presione en Windows para abrir el men\u00fa Configuraci\u00f3n. Una vez abierto, Editor: Formatear al guardar<\/code> Busque y aseg\u00farese de que la opci\u00f3n est\u00e9 marcada:<\/p>\n
      \"\"
      \nUna vez configurado, puedes escribir tu c\u00f3digo como de costumbre y se formatear\u00e1 autom\u00e1ticamente cuando guardes el archivo.<\/p>\n
      Paso 3 \u2013 Cambiar la configuraci\u00f3n m\u00e1s bonita<\/h2>\n
      Prettier hace gran parte del trabajo por ti de forma predeterminada, pero tambi\u00e9n puedes personalizar la configuraci\u00f3n.<\/p>\n
      Abre el men\u00fa Configuraci\u00f3n. Busca "Prettier". Aparecer\u00e1n todas las opciones que puedes cambiar:<\/p>\n
      \"\"
      \nA continuaci\u00f3n se muestran algunas de las configuraciones m\u00e1s comunes:<\/p>\n
        \n
      • Comillas simples: elija entre comillas simples y dobles.<\/li>\n
      • Semi \u2013 Elija si debe haber punto y coma al final de las l\u00edneas.<\/li>\n
      • Ancho de tabulaci\u00f3n: especifique cu\u00e1ntos espacios desea que se inserten en una tabulaci\u00f3n.<\/li>\n<\/ul>\n
        La desventaja de usar el men\u00fa de configuraci\u00f3n integrado en VS Code es que no garantiza la coherencia entre los desarrolladores de su equipo.<\/p>\n
        Paso 4 \u2013 Crear un archivo de configuraci\u00f3n m\u00e1s atractivo<\/h2>\n
        Si cambias la configuraci\u00f3n en VS Code, otra persona podr\u00eda tener una configuraci\u00f3n completamente diferente en su equipo. Puedes crear un formato uniforme para todo tu equipo creando un archivo de configuraci\u00f3n para tu proyecto.<\/p>\n
        Un nuevo archivo llamado extensi\u00f3n prettierrc<\/code> Crea con una de las siguientes extensiones:<\/p>\n
          \n
        • yml<\/code><\/li>\n
        • yaml<\/code><\/li>\n
        • JSON<\/code><\/li>\n
        • js<\/code><\/li>\n
        • Toml<\/code><\/li>\n<\/ul>\n
          A continuaci\u00f3n se muestra un ejemplo de un archivo de configuraci\u00f3n simple que utiliza JSON:<\/p>\n
          \n
          {\r\n\"trailingComma\": \"es5\",\r\n\"tabWidth\": 4,\r\n\"semi\": false,\r\n\"singleQuote\": true\r\n}<\/code><\/pre>\n<\/div>\n
          Para m\u00e1s detalles sobre los archivos de configuraci\u00f3n, consulta la documentaci\u00f3n m\u00e1s completa. Una vez que crees uno y lo uses en tu proyecto, podr\u00e1s asegurarte de que todos en el equipo sigan las mismas reglas de formato.<\/p>\n
          Introducci\u00f3n<\/h2>\n
          Tener un c\u00f3digo consistente es una buena pr\u00e1ctica. Es especialmente \u00fatil al trabajar en un proyecto con varios colaboradores. Acordar una configuraci\u00f3n facilita la legibilidad y la comprensi\u00f3n del c\u00f3digo. Se puede dedicar m\u00e1s tiempo a resolver problemas t\u00e9cnicos complejos, en lugar de lidiar con problemas resueltos como la sangr\u00eda del c\u00f3digo.<\/p>","protected":false},"excerpt":{"rendered":"Introducci\u00f3n. Dar formato al c\u00f3digo es un desaf\u00edo constante, pero las herramientas de desarrollo modernas lo hacen posible\u2026","protected":false},"author":1,"featured_media":15157,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_yoast_wpseo_focuskw":"\u0646\u062d\u0648\u0647 \u0642\u0627\u0644\u0628 \u0628\u0646\u062f\u06cc \u06a9\u062f \u0628\u0627 Prettier \u062f\u0631 Visual Studio Code","_yoast_wpseo_title":"","_yoast_wpseo_metadesc":"","_yoast_wpseo_canonical":"","_yoast_wpseo_opengraph-description":"","_yoast_wpseo_opengraph-image":"","_yoast_wpseo_twitter-description":"","_yoast_wpseo_twitter-image":"","_yoast_wpseo_focuskeywords":"","_yoast_wpseo_primary_category":"193","footnotes":""},"categories":[193,363],"tags":[371,366],"class_list":{"0":"post-15150","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","7":"category-tutorials","8":"category-programming","9":"tag-vsc","10":"tag-366"},"yoast_head":"\n\u0646\u062d\u0648\u0647 \u0642\u0627\u0644\u0628 \u0628\u0646\u062f\u06cc \u06a9\u062f \u0628\u0627 Prettier \u062f\u0631 Visual Studio Code - \u0628\u0644\u0627\u06af ITPiran<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.itpiran.net\/blog\/es\/tutorials\/how-to-format-code-with-prettier-in-visual-studio-code\/\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"\u0646\u062d\u0648\u0647 \u0642\u0627\u0644\u0628 \u0628\u0646\u062f\u06cc \u06a9\u062f \u0628\u0627 Prettier \u062f\u0631 Visual Studio Code - \u0628\u0644\u0627\u06af ITPiran\" \/>\n<meta property=\"og:description\" content=\"\u0645\u0642\u062f\u0645\u0647 \u0642\u0627\u0644\u0628\u200c\u0628\u0646\u062f\u06cc \u06a9\u062f \u0628\u0647 \u0637\u0648\u0631 \u0645\u062f\u0627\u0648\u0645 \u06cc\u06a9 \u0686\u0627\u0644\u0634 \u0627\u0633\u062a\u060c \u0627\u0645\u0627 \u0627\u0628\u0632\u0627\u0631\u0647\u0627\u06cc \u062a\u0648\u0633\u0639\u0647\u200c\u062f\u0647\u0646\u062f\u0647 \u0645\u062f\u0631\u0646 \u0627\u06cc\u0646 \u0627\u0645\u06a9\u0627\u0646 \u0631\u0627 \u0641\u0631\u0627\u0647\u0645 \u0645\u06cc\u200c\u06a9\u0646\u0646\u062f…\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.itpiran.net\/blog\/es\/tutorials\/how-to-format-code-with-prettier-in-visual-studio-code\/\" \/>\n<meta property=\"og:site_name\" content=\"\u0628\u0644\u0627\u06af ITPiran\" \/>\n<meta property=\"article:published_time\" content=\"2024-03-31T15:26:41+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/cdn.itpiran.net\/2024\/03\/31185236\/Prettier-vsc.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1793\" \/>\n\t<meta property=\"og:image:height\" content=\"1110\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"admin\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"admin\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tiempo de lectura\" \/>\n\t<meta name=\"twitter:data2\" content=\"1 minuto\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/tutorials\\\/how-to-format-code-with-prettier-in-visual-studio-code\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/tutorials\\\/how-to-format-code-with-prettier-in-visual-studio-code\\\/\"},\"author\":{\"name\":\"admin\",\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/#\\\/schema\\\/person\\\/04ed27b919baca468a2273f8e4318f81\"},\"headline\":\"\u0646\u062d\u0648\u0647 \u0642\u0627\u0644\u0628 \u0628\u0646\u062f\u06cc \u06a9\u062f \u0628\u0627 Prettier \u062f\u0631 Visual Studio Code\",\"datePublished\":\"2024-03-31T15:26:41+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/tutorials\\\/how-to-format-code-with-prettier-in-visual-studio-code\\\/\"},\"wordCount\":58,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/tutorials\\\/how-to-format-code-with-prettier-in-visual-studio-code\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/cdn.itpiran.net\\\/2024\\\/03\\\/31185236\\\/Prettier-vsc.jpg\",\"keywords\":[\"VSC\",\"\u0628\u0631\u0646\u0627\u0645\u0647 \u0646\u0648\u06cc\u0633\u06cc\"],\"articleSection\":[\"\u0622\u0645\u0648\u0632\u0634\u06cc\",\"\u0628\u0631\u0646\u0627\u0645\u0647 \u0646\u0648\u06cc\u0633\u06cc\"],\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/tutorials\\\/how-to-format-code-with-prettier-in-visual-studio-code\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/tutorials\\\/how-to-format-code-with-prettier-in-visual-studio-code\\\/\",\"url\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/tutorials\\\/how-to-format-code-with-prettier-in-visual-studio-code\\\/\",\"name\":\"\u0646\u062d\u0648\u0647 \u0642\u0627\u0644\u0628 \u0628\u0646\u062f\u06cc \u06a9\u062f \u0628\u0627 Prettier \u062f\u0631 Visual Studio Code - \u0628\u0644\u0627\u06af ITPiran\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/tutorials\\\/how-to-format-code-with-prettier-in-visual-studio-code\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/tutorials\\\/how-to-format-code-with-prettier-in-visual-studio-code\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/cdn.itpiran.net\\\/2024\\\/03\\\/31185236\\\/Prettier-vsc.jpg\",\"datePublished\":\"2024-03-31T15:26:41+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/tutorials\\\/how-to-format-code-with-prettier-in-visual-studio-code\\\/#breadcrumb\"},\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/tutorials\\\/how-to-format-code-with-prettier-in-visual-studio-code\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/tutorials\\\/how-to-format-code-with-prettier-in-visual-studio-code\\\/#primaryimage\",\"url\":\"https:\\\/\\\/cdn.itpiran.net\\\/2024\\\/03\\\/31185236\\\/Prettier-vsc.jpg\",\"contentUrl\":\"https:\\\/\\\/cdn.itpiran.net\\\/2024\\\/03\\\/31185236\\\/Prettier-vsc.jpg\",\"width\":1793,\"height\":1110},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/tutorials\\\/how-to-format-code-with-prettier-in-visual-studio-code\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"\u0622\u0645\u0648\u0632\u0634\u06cc\",\"item\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/category\\\/tutorials\\\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"\u0646\u062d\u0648\u0647 \u0642\u0627\u0644\u0628 \u0628\u0646\u062f\u06cc \u06a9\u062f \u0628\u0627 Prettier \u062f\u0631 Visual Studio Code\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/\",\"name\":\"\u0628\u0644\u0627\u06af ITPiran\",\"description\":\"\u0627\u062e\u0628\u0627\u0631 \u0648 \u0645\u0642\u0627\u0644\u0627\u062a \u062a\u062c\u0627\u0631\u062a \u067e\u0627\u06cc\u062f\u0627\u0631 \u0627\u06cc\u0631\u0627\u0646\u06cc\u0627\u0646\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"es\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/#organization\",\"name\":\"\u0628\u0644\u0627\u06af \u062a\u062c\u0627\u0631\u062a \u067e\u0627\u06cc\u062f\u0627\u0631 \u0627\u06cc\u0631\u0627\u0646\u06cc\u0627\u0646\",\"alternateName\":\"ITPIran Blog\",\"url\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/cdn.itpiran.net\\\/2023\\\/12\\\/27150508\\\/cropped-ITPIRAN-BLOG-LOGO-2.png\",\"contentUrl\":\"https:\\\/\\\/cdn.itpiran.net\\\/2023\\\/12\\\/27150508\\\/cropped-ITPIRAN-BLOG-LOGO-2.png\",\"width\":512,\"height\":512,\"caption\":\"\u0628\u0644\u0627\u06af \u062a\u062c\u0627\u0631\u062a \u067e\u0627\u06cc\u062f\u0627\u0631 \u0627\u06cc\u0631\u0627\u0646\u06cc\u0627\u0646\"},\"image\":{\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\"}},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/#\\\/schema\\\/person\\\/04ed27b919baca468a2273f8e4318f81\",\"name\":\"admin\",\"url\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/es\\\/author\\\/admin\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"C\u00f3mo formatear c\u00f3digo con Prettier en Visual Studio Code - Blog de ITPiran","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.itpiran.net\/blog\/es\/tutorials\/how-to-format-code-with-prettier-in-visual-studio-code\/","og_locale":"es_ES","og_type":"article","og_title":"\u0646\u062d\u0648\u0647 \u0642\u0627\u0644\u0628 \u0628\u0646\u062f\u06cc \u06a9\u062f \u0628\u0627 Prettier \u062f\u0631 Visual Studio Code - \u0628\u0644\u0627\u06af ITPiran","og_description":"\u0645\u0642\u062f\u0645\u0647 \u0642\u0627\u0644\u0628\u200c\u0628\u0646\u062f\u06cc \u06a9\u062f \u0628\u0647 \u0637\u0648\u0631 \u0645\u062f\u0627\u0648\u0645 \u06cc\u06a9 \u0686\u0627\u0644\u0634 \u0627\u0633\u062a\u060c \u0627\u0645\u0627 \u0627\u0628\u0632\u0627\u0631\u0647\u0627\u06cc \u062a\u0648\u0633\u0639\u0647\u200c\u062f\u0647\u0646\u062f\u0647 \u0645\u062f\u0631\u0646 \u0627\u06cc\u0646 \u0627\u0645\u06a9\u0627\u0646 \u0631\u0627 \u0641\u0631\u0627\u0647\u0645 \u0645\u06cc\u200c\u06a9\u0646\u0646\u062f…","og_url":"https:\/\/www.itpiran.net\/blog\/es\/tutorials\/how-to-format-code-with-prettier-in-visual-studio-code\/","og_site_name":"\u0628\u0644\u0627\u06af ITPiran","article_published_time":"2024-03-31T15:26:41+00:00","og_image":[{"width":1793,"height":1110,"url":"https:\/\/cdn.itpiran.net\/2024\/03\/31185236\/Prettier-vsc.jpg","type":"image\/jpeg"}],"author":"admin","twitter_card":"summary_large_image","twitter_misc":{"Escrito por":"admin","Tiempo de lectura":"1 minuto"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.itpiran.net\/blog\/tutorials\/how-to-format-code-with-prettier-in-visual-studio-code\/#article","isPartOf":{"@id":"https:\/\/www.itpiran.net\/blog\/tutorials\/how-to-format-code-with-prettier-in-visual-studio-code\/"},"author":{"name":"admin","@id":"https:\/\/www.itpiran.net\/blog\/#\/schema\/person\/04ed27b919baca468a2273f8e4318f81"},"headline":"\u0646\u062d\u0648\u0647 \u0642\u0627\u0644\u0628 \u0628\u0646\u062f\u06cc \u06a9\u062f \u0628\u0627 Prettier \u062f\u0631 Visual Studio Code","datePublished":"2024-03-31T15:26:41+00:00","mainEntityOfPage":{"@id":"https:\/\/www.itpiran.net\/blog\/tutorials\/how-to-format-code-with-prettier-in-visual-studio-code\/"},"wordCount":58,"commentCount":0,"publisher":{"@id":"https:\/\/www.itpiran.net\/blog\/#organization"},"image":{"@id":"https:\/\/www.itpiran.net\/blog\/tutorials\/how-to-format-code-with-prettier-in-visual-studio-code\/#primaryimage"},"thumbnailUrl":"https:\/\/cdn.itpiran.net\/2024\/03\/31185236\/Prettier-vsc.jpg","keywords":["VSC","\u0628\u0631\u0646\u0627\u0645\u0647 \u0646\u0648\u06cc\u0633\u06cc"],"articleSection":["\u0622\u0645\u0648\u0632\u0634\u06cc","\u0628\u0631\u0646\u0627\u0645\u0647 \u0646\u0648\u06cc\u0633\u06cc"],"inLanguage":"es","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.itpiran.net\/blog\/tutorials\/how-to-format-code-with-prettier-in-visual-studio-code\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.itpiran.net\/blog\/tutorials\/how-to-format-code-with-prettier-in-visual-studio-code\/","url":"https:\/\/www.itpiran.net\/blog\/tutorials\/how-to-format-code-with-prettier-in-visual-studio-code\/","name":"C\u00f3mo formatear c\u00f3digo con Prettier en Visual Studio Code - Blog de ITPiran","isPartOf":{"@id":"https:\/\/www.itpiran.net\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.itpiran.net\/blog\/tutorials\/how-to-format-code-with-prettier-in-visual-studio-code\/#primaryimage"},"image":{"@id":"https:\/\/www.itpiran.net\/blog\/tutorials\/how-to-format-code-with-prettier-in-visual-studio-code\/#primaryimage"},"thumbnailUrl":"https:\/\/cdn.itpiran.net\/2024\/03\/31185236\/Prettier-vsc.jpg","datePublished":"2024-03-31T15:26:41+00:00","breadcrumb":{"@id":"https:\/\/www.itpiran.net\/blog\/tutorials\/how-to-format-code-with-prettier-in-visual-studio-code\/#breadcrumb"},"inLanguage":"es","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.itpiran.net\/blog\/tutorials\/how-to-format-code-with-prettier-in-visual-studio-code\/"]}]},{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/www.itpiran.net\/blog\/tutorials\/how-to-format-code-with-prettier-in-visual-studio-code\/#primaryimage","url":"https:\/\/cdn.itpiran.net\/2024\/03\/31185236\/Prettier-vsc.jpg","contentUrl":"https:\/\/cdn.itpiran.net\/2024\/03\/31185236\/Prettier-vsc.jpg","width":1793,"height":1110},{"@type":"BreadcrumbList","@id":"https:\/\/www.itpiran.net\/blog\/tutorials\/how-to-format-code-with-prettier-in-visual-studio-code\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.itpiran.net\/blog\/"},{"@type":"ListItem","position":2,"name":"\u0622\u0645\u0648\u0632\u0634\u06cc","item":"https:\/\/www.itpiran.net\/blog\/category\/tutorials\/"},{"@type":"ListItem","position":3,"name":"\u0646\u062d\u0648\u0647 \u0642\u0627\u0644\u0628 \u0628\u0646\u062f\u06cc \u06a9\u062f \u0628\u0627 Prettier \u062f\u0631 Visual Studio Code"}]},{"@type":"WebSite","@id":"https:\/\/www.itpiran.net\/blog\/#website","url":"https:\/\/www.itpiran.net\/blog\/","name":"Blog de ITPiran","description":"Noticias y art\u00edculos sobre comercio sostenible en Ir\u00e1n","publisher":{"@id":"https:\/\/www.itpiran.net\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.itpiran.net\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"es"},{"@type":"Organization","@id":"https:\/\/www.itpiran.net\/blog\/#organization","name":"Blog sobre negocios iran\u00edes sostenibles","alternateName":"ITPIran Blog","url":"https:\/\/www.itpiran.net\/blog\/","logo":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/www.itpiran.net\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/cdn.itpiran.net\/2023\/12\/27150508\/cropped-ITPIRAN-BLOG-LOGO-2.png","contentUrl":"https:\/\/cdn.itpiran.net\/2023\/12\/27150508\/cropped-ITPIRAN-BLOG-LOGO-2.png","width":512,"height":512,"caption":"\u0628\u0644\u0627\u06af \u062a\u062c\u0627\u0631\u062a \u067e\u0627\u06cc\u062f\u0627\u0631 \u0627\u06cc\u0631\u0627\u0646\u06cc\u0627\u0646"},"image":{"@id":"https:\/\/www.itpiran.net\/blog\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/www.itpiran.net\/blog\/#\/schema\/person\/04ed27b919baca468a2273f8e4318f81","name":"administraci\u00f3n","url":"https:\/\/www.itpiran.net\/blog\/es\/author\/admin\/"}]}},"_links":{"self":[{"href":"https:\/\/www.itpiran.net\/blog\/es\/wp-json\/wp\/v2\/posts\/15150","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.itpiran.net\/blog\/es\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.itpiran.net\/blog\/es\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.itpiran.net\/blog\/es\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.itpiran.net\/blog\/es\/wp-json\/wp\/v2\/comments?post=15150"}],"version-history":[{"count":1,"href":"https:\/\/www.itpiran.net\/blog\/es\/wp-json\/wp\/v2\/posts\/15150\/revisions"}],"predecessor-version":[{"id":15158,"href":"https:\/\/www.itpiran.net\/blog\/es\/wp-json\/wp\/v2\/posts\/15150\/revisions\/15158"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.itpiran.net\/blog\/es\/wp-json\/wp\/v2\/media\/15157"}],"wp:attachment":[{"href":"https:\/\/www.itpiran.net\/blog\/es\/wp-json\/wp\/v2\/media?parent=15150"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.itpiran.net\/blog\/es\/wp-json\/wp\/v2\/categories?post=15150"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.itpiran.net\/blog\/es\/wp-json\/wp\/v2\/tags?post=15150"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}