Maison >outils de développement >sublime >Partagez un plug-in pour Sublime Text3 qui prend en charge le formatage du code JSX et es201x

Partagez un plug-in pour Sublime Text3 qui prend en charge le formatage du code JSX et es201x

藏色散人
藏色散人avant
2021-04-28 16:54:032503parcourir

La colonne tutorielle suivante de sublime recommande un plug-in pour sublime text 3 qui prend en charge le formatage du code JSX et es201x. J'espère qu'il sera utile aux amis dans le besoin !

Partagez un plug-in pour Sublime Text3 qui prend en charge le formatage du code JSX et es201x

Recommander un plug-in pour Sublime Text 3 qui prend en charge le formatage de code JSX et es201x

Quand j'ai commencé à jouer React récemment, je Je l'utilise Sublime Text3 me fait vraiment souffrir de trouble obsessionnel-compulsif. Il ne prend pas en charge la mise en évidence de JSX. Après l'installation de Babel, un nouveau problème est survenu. . .

J'ai essayé deux ou trois plug-ins (jsfmt etc.) l'un après l'autre, mais aucun d'entre eux n'était idéal.
esformatter-jsx peut être utilisé, mais l'indentation de JSX et l'étrange indentation d'énoncés tels que switch sont terribles.
Enfin, alors que j'étais sur le point de changer d'IDE, j'ai vu que l'un des éléments de configuration du plug-in de formatage VSCode était esformatter-jsx, et vous pouviez également choisir prettier.

plus joli site officiel (Science Internet) : https://prettier.io/docs/en/install.html
Vous pouvez voir que Facebook l'utilise pour optimiser le code du React projet , mais je n'y suis pas allé.

Exécuter npm i -g prettier
Le package téléchargé contient un bin-prettier.js, qui est l'ontologie.

sublime text3 recherchez directement package control dans prettier pour télécharger, ouvrez son User élément de configuration, ajoutez-le comme suit et enregistrez-le.

Attention à modifier vos chemins locaux node et node_modules
{
  "debug": false,
  "prettier_cli_path": "/usr/local/lib/node_modules/prettier/bin-prettier.js",
  "node_path": "/usr/local/bin/node",
  "auto_format_on_save": false,
  "auto_format_on_save_excludes": [],
  "allow_inline_formatting": false,
  "custom_file_extensions": [],
  "max_file_size_limit": -1,
  "additional_cli_args": {},
  "prettier_options": {
    "printWidth": 80,
    "singleQuote": false,
    "trailingComma": "none",
    "bracketSpacing": true,
    "jsxBracketSameLine": false,
    "parser": "babylon",
    "semi": true,
    "requirePragma": false,
    "proseWrap": "preserve",
    "arrowParens": "avoid"
  }
}

et ajoutez

{
  "keys": ["super+shift+c"],
  "command": "format_javascript"
}

à la configuration des touches de raccourci. Pour plus de détails, vous pouvez aller sur github. pour voir le Readme de l'auteur du plug-in

Les fonctions du plug-in ne sont pas toutes des fonctions Vous pouvez utiliser des instructions sur la ligne de commande pour formater le code (peut-il aussi être cité directement dans le projet ?)

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Cet article est reproduit dans:. en cas de violation, veuillez contacter admin@php.cn Supprimer