JavaScript Standard Style
English • Español (Latinoamérica) • Italiano (Italian) • 한국어 (Korean) • Português (Brasil) • 简体中文 (Simplified Chinese) • 繁體中文 (Taiwanese Mandarin)
](https://www.npmjs.com) | [
](https://github.com) | [
](https://opbeat.com) | [
](http://www.nearform.com) | [
](https://www.brave.com) |
|---|---|---|---|---|
| [
](https://zeit.co) | [
](https://www.zendesk.com) | [
](https://www.mongodb.com) | [
](https://www.typeform.com) | [
](https://gds.blog.gov.uk) |
|---|---|---|---|---|
[
](http://expressjs.com) | [
](https://webtorrent.io) | [
](https://ipfs.io) | [
](https://datproject.org) | [
](https://bitcoinjs.org) |
|---|---|---|---|---|
[
](https://atom.io) | [
](http://electron.atom.io) | [
](https://voltra.co) | [
](https://www.treasuredata.com) | [
](https://clevertech.biz) |
|---|---|---|---|---|
[
](https://www.apstudynotes.org) | [
](https://www.optiopay.com) | [
](https://www.jlrtechincubator.com/jlrti/) | [
](https://www.bustle.com) | [
](https://www.zentrick.com) |
|---|---|---|---|---|
[
](https://nodesource.com) | [
](https://greenkeeper.io) | [
](https://karma-runner.github.io) | [
](https://www.taser.com) |
|---|---|---|---|---|
Adicionalmente a compañías, muchos miembros de la comunidad usan `standard` en modulos que son
[muy numerosos](https://raw.githubusercontent.com/feross/standard-packages/master/all.json) para listar aquí.
También `standard` es el linter con más estrellas en GitHub
[Clean Code Linter](https://github.com/showcases/clean-code-linters).
## ¿Hay plugins para editores de textos?
Primero, instale `standard`. Luego, instale el plugin apropiado para su editor:
#### Sublime Text
Usando **[Package Control][sublime-1]**, instale **[SublimeLinter][sublime-2]** y
**[SublimeLinter-contrib-standard][sublime-3]**.
Para formateo automático al guardar, instale **[StandardFormat][sublime-4]**.
[sublime-1]: https://packagecontrol.io/
[sublime-2]: http://www.sublimelinter.com/en/latest/
[sublime-3]: https://packagecontrol.io/packages/SublimeLinter-contrib-standard
[sublime-4]: https://packagecontrol.io/packages/StandardFormat
#### Atom
Instale **[linter-js-standard][atom-1]**.
Para formateo automático al guardar, instale **[standard-formatter][atom-2]**. Para snippets,
instale **[standardjs-snippets][atom-3]**.
[atom-1]: https://atom.io/packages/linter-js-standard
[atom-2]: https://atom.io/packages/standard-formatter
[atom-3]: https://atom.io/packages/standardjs-snippets
#### Visual Studio Code
Instale **[vscode-standardjs][vscode-1]**. (Incluye soporte para formateo automático.)
Para snippets JS, instale: **[vscode-standardjs-snippets][vscode-2]**.
Para snippets React, instale **[vscode-react-standard][vscode-3]**.
[vscode-1]: https://marketplace.visualstudio.com/items/chenxsan.vscode-standardjs
[vscode-2]: https://marketplace.visualstudio.com/items?itemName=capaj.vscode-standardjs-snippets
[vscode-3]: https://marketplace.visualstudio.com/items/TimonVS.ReactSnippetsStandard
#### Vim
instale **[Syntastic][vim-1]** y agregue esta línea a su `.vimrc`:
```vim
let g:syntastic_javascript_checkers = ['standard']
```
Para formateo automático al guardar, agregue estas dos líneas a su `.vimrc`:
```vim
autocmd bufwritepost *.js silent !standard --fix %
set autoread
```
[vim-1]: https://github.com/scrooloose/syntastic
#### Emacs
Instale **[Flycheck][emacs-1]** y revise **[manual][emacs-2]** para aprender
como habilitarlo en sus proyectos.
[emacs-1]: http://www.flycheck.org
[emacs-2]: http://www.flycheck.org/en/latest/user/installation.html
#### Brackets
Busque el registro de extension para **["Standard Code Style"][brackets-1]**.
[brackets-1]: https://github.com/ishamf/brackets-standard/
#### [WebStorm and other JetBrains products][webstorm-1]
WebStorm [recientemente anuncio soporte nativo](https://blog.jetbrains.com/webstorm/2017/01/webstorm-2017-1-eap-171-2272/) para `standard` diractemente en el IDE.
Si aun prefieres configurar `standard` manualmente [sigue esta guia](webstorm-2). Esto se aplica a todos los productos de JetBrains, incluyendo PhpStorm, IntelliJ, RubyMine y etc.
[webstorm-1]: https://www.jetbrains.com/webstorm/
[webstorm-2]: webstorm.md
## Hay alguna medalla para readme?
Si! Si estas usando `standard` en tu proyecto, puedes includir una de estas en tu readme para
hacerle saber a las personas que en tu código estas usando estilos standard.
[](https://github.com/standard/standard)
```markdown
[](https://github.com/standard/standard)
```
[](https://standardjs.com/)
```markdown
[](https://standardjs.com/)
```
## No estoy de acuerdo con la regla X, ¿la puedo cambiar?
No. El objetivo de `standard` es evitar [bikeshedding][bikeshedding] en el estilo. Existen un montón de debates online acerca de tabs vs espacios, etc. que nunca serán resueltos. Estos debates solo te distraen de hacer tu trabajo. Al final del día tienes simplemente que “usar alguno”, y esa es toda la filosofía de `standard` -- es un montón de sensibles opiniones de “usar alguno”. Con la esperanza que los usuarios vean el valor en esto más que defender sus propias opiniones.
Si realmente quieres configurar cientos de reglas individualmente, puedes usar `eslint` directamente con [eslint-config-standard](https://github.com/standard/eslint-config-standard) aplicando
cambios encima de este.
Tip: ¡Simplemente usa `standard` y ya está. Existen problemas reales
en los cuales debes usar tu tiempo! :P
[bikeshedding]: https://www.freebsd.org/doc/en/books/faq/misc.html#bikeshed-painting
## ¡Pero esto no un estandar web real!
¡Por su puesto que no lo es! Este estilo no está afiliado a ningún grupo oficial de estándar web, por eso este repositorio se llama `feross/standard` y no `ECMA/standard`.
La palabra “estándar” tiene más significados que solo “estándar web” :-) Por ejemplo:
- Este módulo ayuda a mantener el código a la más alta *calidad estándar*.
- Este módulo asegura que las nuevas contribuciones sigan los *estilos estándar* básicos.
## ¿Hay algún formateador automático?
¡Sí! Puedes usar `standard --fix` para arreglar la mayoría de problemas automáticamente.
`standard --fix` está integrado en `standard` (desde v8.0.0) para máxima conveniencia.
La mayoría de los problemas se arreglan, pero algunos errores (olvidar gestionar errores en callbacks) deben ser arreglados manualmente.
Para no perder el tiempo, `standard` emite un mensaje ("Run `standard --fix` to
automatically fix some problems.") cuando detecta errores que pueden ser arreglados automáticamente.
## ¿Cómo hago para ignorar archivos?
Ciertas rutas (`node_modules/`, `coverage/`, `vendor/`, `*.min.js`, `bundle.js`, y archivos/directorios que empiezan con `.` cómo `.git`) son ignorados automáticamente.
Las rutas del `.gitignore` del proyecto raíz son ignorados automáticamente.
A veces necesitas ignorar directorios o archivos específicos. Para hacerlo, agrega la propiedad `standard.ignore` al `package.json`:
```json
"standard": {
"ignore": [
"**/out/",
"/lib/select2/",
"/lib/ckeditor/",
"tmp.js"
]
}
```
## ¿Cómo oculto cierta alerta?
En raros casos, necesitarás romper una regla y ocultar la alerta generada por `standard`.
JavaScript Standard Style usa [ESLint](http://eslint.org/) bajo la capucha y puedes ocultar las alertas como normalmente lo harías si usaras ESLint directamente.
Para obtener una salida mas especifica (así puedes encontrar el nombre de la regla a ignorar) ejecute:
```bash
$ standard --verbose
Error: Use JavaScript Standard Style
routes/error.js:20:36: 'file' was used before it was defined. (no-use-before-define)
```
Inhabilitar **toda las reglas** en una linea especifica:
```js
file = 'I know what I am doing' // eslint-disable-line
```
O, inhabilitar **solo** la regla `"no-use-before-define"`:
```js
file = 'I know what I am doing' // eslint-disable-line no-use-before-define
```
O, inhabilitar la regla `"no-use-before-define"` para **múltiples lineas**:
```js
/* eslint-disable no-use-before-define */
console.log('offending code goes here...')
console.log('offending code goes here...')
console.log('offending code goes here...')
/* eslint-enable no-use-before-define */
```
## Yo uso una librería que contamina el espacio de nombres global. ¿Cómo puedo evitar los errores "variable is not defined"?
Algunos paquetes (ej `mocha`) colocan sus funciones (ej: `describe`, `it`) en el objeto global (¡mala manera!). Como estas funciones no están definidas o requeridas (ej: `require`) en ningún lugar del código, `standard` te alertara que están usando una variable que no está definida (usualmente, esta regla es realmente útil para detectar errores de tipeo). Pero queremos inhabilitar estas variables globales.
Para hacerle saber a `standard` (como también a los humanos que leen tu código) que ciertas variables son globales en tu código, agregar esto en la parte superior de tu código:
```js
/* global myVar1, myVar2 */
```
Si tienes cientos de archivos, seria deseable evitar agregar comentarios a cada archivo.
En este caso ejecute:
```bash
$ standard --global myVar1 --global myVar2
```
O, agregar esto a su `package.json`
```json
{
"standard": {
"globals": [ "myVar1", "myVar2" ]
}
}
```
*Nota: `global` y `globals` son equivalentes*
## ¿Cómo puedo usar características experimentales JavaScript (ES Next)?
`standard` soporta las ultimas características de ECMAscript, ES8 (ES2017) incluyendo todas las características del lenguaje
de las propuestas que estan en "Stage 4" del proceso de propuestas.
Para soportar características experimentales del lenguaje, `standard` soporta especificar un parser JS customizado. Antes de que uses un parser customizado, considera si la complejidad agregada vale la pena.
Para usar un parser customizado, instálalo desde npm (ejemplo: `npm install babel-eslint`) y ejecuta esto:
```bash
$ standard --parser babel-eslint
```
O, agrega esto a `package.json`:
```json
{
"standard": {
"parser": "babel-eslint"
}
}
```
Si `standard` está instalado globalmente (ej: `npm install standard --global`), entonces asegúrate de instalar `babel-eslint` globalmente también com `npm install babel-eslint --global`.
## ¿Puedo usar una variación de lenguaje JavaScript, como Flow?
Antes de usar una variable del lenguaje JavaScript customizado, considera si la complejidad agregada
(y esfuerzo requerido para obtener los contribuidores alcanzarle con rapidez) vale la pena.
`standard` soporta plugins ESLint. Usa uno de estos para transformar el código a JavaScript válido antes de que `standard` lo vea. Para usar un parser customizado, instálalo desde
npm (example: `npm install eslint-plugin-flowtype`) y ejecuta:
```bash
$ standard --plugin flowtype
```
O, agrega esto a `package.json`:
```json
{
"standard": {
"parser": "babel-eslint",
"plugins": [
"flowtype"
]
}
}
```
Si `standard` está instalado globalmente (ej: `npm install standard --global`), entonces asegúrate de instalar `eslint-plugin-flowtype` globalmente también, con `npm install eslint-plugin-flowtype -g`.
*Nota: `plugin` y `plugins` son equivalentes*
## ¿Qué pasa con Mocha, Jasmine, QUnit y etc?
Para soportar mocha en tus archivos de tests, agrega esto al inicio de los archivos:
```js
/* eslint-env mocha */
```
O, ejecuta:
```bash
$ standard --env mocha
```
Donde `mocha` puede ser `jasmine`, `qunit`, `phantomjs`, y así sucesivamente.
Para ver la lista completa, comprueba la documentación de ESLint [especificando entornos](http://eslint.org/docs/user-guide/configuring.html#specifying-environments).
Para una lista de qué variables globales están disponibles en estos entornos comprueba el módulo npm [globals](https://github.com/sindresorhus/globals/blob/master/globals.json).
*Nota: `env` y `envs` son equivalentes*
## ¿Qué pasa con Web Workers?
Agrega esto al inicio de tus archivos:
```js
/* eslint-env serviceworker */
```
Esto le hará saber a` standard` (como también humanos que leen tu código) que
`self` es una variable global en el codigo web worker.
## ¿Puedo verificar código dentro de archivos Markdown o HTML?
Para verificar código dentro de archivos Markdown use [`standard-markdown`](https://www.npmjs.com/package/standard-markdown).
Alternativamente, hay plugins ESLint para verificar código de Markdown,
HTML y otros tipos de lenguajes:
Para verificar código dentro de archivos Markdown, usa el plugin ESLint:
```bash
$ npm install eslint-plugin-markdown
```
Luego para verificar código JS que aparece dentro de bloques código, ejecute:
```bash
$ standard --plugin markdown '**/*.md'
```
Para verificar código dentro de archivos HTML, use el plugin ESLint:
```bash
$ npm install eslint-plugin-html
```
Luego para verificar el código que aparece dentro de etiquetas `