• Stars
    star
    140
  • Rank 260,061 (Top 6 %)
  • Language
    Python
  • License
    MIT License
  • Created over 8 years ago
  • Updated over 2 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

Sublime Text 3 Plugin to Autoformat with Eslint

ESLint-Formatter for Sublime Text 3

Sublime Text 3 Plugin to autoformat your javascript code according to the ESLint configuration files you already have.

This plugin formats but does not lint your code. To also enable linting, use this plugin in conjuction with SublimeLinter-eslint.

Installation

Linter installation

This Sublime Text Plugin depends on a valid installation of eslint version 3 or higher. To install eslint, follow the getting started guide: http://eslint.org/docs/user-guide/getting-started.

Plugin installation

Please use Package Control to install the linter plugin. This will ensure that the plugin will be updated when new versions are available. If you want to install from source so you can modify the source code, you probably know what you are doing so we won’t cover that here.

To install via Package Control, do the following:

  1. Within Sublime Text, bring up the Command Palette and type install. Among the commands you should see Package Control: Install Package. If that command is not highlighted, use the keyboard or mouse to select it. There will be a pause of a few seconds while Package Control fetches the list of available plugins.

  2. When the plugin list appears, type eslint format. Among the entries you should see ESLint-Formatter. If that entry is not highlighted, use the keyboard or mouse to select it.

Commands

Command palette:

  • ESLintFormatter: Format this file

Shortcut key:

  • Linux/Windows: [Ctrl + Shift + H]
  • Mac: [Cmd + Shift + H]

Behavior

The formatting will be applied to the last saved state of a file, not the current buffer. If not using the format_on_save: true option, you have to save your file first and then run the command.

Settings

By default, ESLintFormatter will supply the following settings:

{
  // The Nodejs installation path
  // If these are false, we'll invoke the eslint binary directly.
  "node_path": {
    "windows": "node.exe",
    "linux": "/usr/bin/nodejs",
    "osx": "/usr/local/bin/node"
  },

  // The location to search for a locally installed eslint package.
  // These are all relative paths to a project's directory.
  // If this is not found or are false, it will try to fallback to a global package
  // (see 'eslint_path' below)
  "local_eslint_path": {
    "windows": "node_modules/eslint/bin/eslint.js",
    "linux": "node_modules/.bin/eslint",
    "osx": "node_modules/.bin/eslint"
  },

  // The location of the globally installed eslint package to use as a fallback
  "eslint_path": {
    "windows": "%APPDATA%/npm/node_modules/eslint/bin/eslint",
    "linux": "/usr/bin/eslint",
    "osx": "/usr/local/bin/eslint"
  },

  // Specify this path to an eslint config file to override the default behavior.
  // Passed to eslint as --config. Read more here:
  // http://eslint.org/docs/user-guide/command-line-interface#c---config
  // If an absolute path is provided, it will use as is.
  // Else, it will look for the file in the root of the project directory.
  // Failing either, it will skip the config file
  "config_path": "",

  // Specify the name of a config file, which determines the root of your
  // project. This is a pattern such as ".eslintrc.json" or "package.json"
  // and will be searched for upwards, to determine the working directory
  // for linting. This is different to config_path and is only used for
  // resolving the working directory.
  "config_file": "",

  // Pass additional arguments to eslint.
  //
  // Each command should be a string where it supports the following replacements:
  //   $project_path - The path to the projects root folder
  //
  // Example:
  //   ["--parser-options={\"tsconfigRootDir\": \"$project_path\"}"]
  "extra_args": [],

  // Automatically format when a file is saved.
  "format_on_save": false,

  // Use --fix-to-stdout, --stdin, and --stdin-filename to update the file if using eslint_d.
  // See https://github.com/mantoni/eslint_d.js#automatic-fixing
  "fix_to_stdout": false,

  // Only attempt to format files with whitelisted extensions on save.
  // Leave empty to disable the check
  "format_on_save_extensions": [
    "js",
    "jsx",
    "es",
    "es6",
    "babel"
  ]
}
  • Modify any settings within the Preferences -> Package Settings -> ESLint-Formatter -> Settings - User file.

Project-specific settings override

To override global plugin configuration for a specific project, add a settings object with a ESLint-Formatter key in your .sublime-project. This file is accessible via Project -> Edit Project.

For example:

{
  "folders": [
    {
      "path": "."
    }
  ],
  "settings": {
    "ESLint-Formatter": {
      "format_on_save": true
    }
  }
}

Performance

If you experience performance issues, it may be worth taking a look at eslint_d. You can modify the settings to point to the eslint_d binary instead of eslint.

For example:

{
  "local_eslint_path": {
    "osx": "node_modules/.bin/eslint_d"
  }
}

Contributing

If you find any bugs feel free to report them here.

Pull requests are also encouraged.

More Repositories

1

react-native-mask-loader

React Native App Loader that shows an expanding image as a mask on your app. Direct rip of Twitter's loading animation.
JavaScript
470
star
2

SublimeJSCSFormatter

Sublime Text 3 Plugin to Autoformat with JSCS
Python
78
star
3

covid19-changes

View the diff of CDC's COVID-19 updates
JavaScript
13
star
4

FitBitSleepCharts

Site that will allow you to see FitBit sleep data over time.
JavaScript
12
star
5

screeps

Some screeps scripts
JavaScript
8
star
6

react-native-libraries

A repository of most popular React Native libraries that can be used for improved community code search
JavaScript
7
star
7

plaster

Realtime collaborative drawing app
6
star
8

find-parent

A utility for finding the nearest parent that matches a test function
JavaScript
6
star
9

rewire-global

Rewire is enabled globally for all modules in node.
JavaScript
5
star
10

timing-stats

Visualize timing statistics
JavaScript
4
star
11

clean-git-ref

Clean an input string into a usable git ref
JavaScript
4
star
12

github-friendship

See the friendship between two Github users
JavaScript
3
star
13

foursquare-embed

Embed Foursquare venue widgets into your site
JavaScript
2
star
14

facebookhack

JavaScript
2
star
15

wedding-site

JavaScript
2
star
16

grunt-path-validator

Validate file naming schemes with Grunt
JavaScript
2
star
17

apt-tracker

Track prices of apartments over time
JavaScript
2
star
18

LinkViewer

A Chrome Extension for a More Transparent Web
JavaScript
2
star
19

git-common-ancestor

Get the common ancestor of a sha and a branch
JavaScript
1
star
20

PowerBB

Import/Backup of the PowerBB Discussion board from 2005-2006
PHP
1
star
21

Saros-Framework

MVC PHP Web Framework
PHP
1
star
22

Whiteboard-old

Import of the old Whiteboard discussion board
PHP
1
star
23

tritowers

Javascript tri towers grid game
JavaScript
1
star
24

javascript-ml

Some machine learning algorithms in javascript
JavaScript
1
star
25

webrtc

Example using WebRTC to capture images from a video stream
JavaScript
1
star
26

react-native-shepherd-migrations

React Native migrations using NerdWallet/shepherd
JavaScript
1
star
27

test-pgo-plugin

An example plugin for https://github.com/PokemonGoF/PokemonGo-Bot
Python
1
star
28

javascript-pathfinding

JavaScript
1
star
29

tar-contents

Read the contents of a tar file
JavaScript
1
star
30

grunt-before-after-hooks

Hook into right before and right after grunt tasks are run
JavaScript
1
star
31

conservice-charges

Visualize your conservice charges over time.
HTML
1
star