npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@ksmithut/prettier-standard

v0.2.0

Published

Prettier and standard brought together!

Downloads

3,525

Readme

prettier-standard

Formats with prettier (actually prettierx) and lints with eslint preconfigured with standard rules (✿◠‿◠)

You don't have to fix any whitespace errors and waste time configuring eslint presets :relieved:

Note on Fork

This is a fork of sheerun/prettier-standard. At the time of forking, it seemed that the project was in need of dependency updates. The author seemed unable to attend to the issues, but it was a package I used and felt strongly enough to do something about it. If the package maintainer returns to maintain the package, I will happily stop work on this and move back over to using that one. In the meantime, I have this Pull Request opened there to get dependencies up to date (with breaking node version requirements).

Installation

yarn add --dev @ksmithut/prettier-standard

If you're using the npm: npm install --save-dev @ksmithut/prettier-standard.

You can also install globally with npm install -g @ksmithut/prettier-standard

Usage

Prettier-standard is best used with prettier-standard --lint command which formats and lints all non-ignored files in repository. Here's full usage:

Usage
  $ prettier-standard [<glob>]

Options
  --format  Just format all files in current repository
  --lint    Additionally lint code after formatting
  --check   Do not format, just check formatting
  --staged  Run only on staged files
  --changed Run only on changed files
  --since   Run only on changed files since given revision
  --lines   Run only on changed lines (warning: experimental!)
  --stdin   Force reading input from stdin
  --parser  Force parser to use for stdin (default: babel)
  --help    Tells how to use prettier-standard

Examples
  $ prettier-standard --changed --lint
  $ prettier-standard --lint '**/*.{js,css}'
  $ prettier-standard --since master
  $ "precommit": "prettier-standard --lint --staged" # in package.json
  $ echo 'const {foo} = "bar";' | prettier-standard --stdin
  $ echo '.foo { color: "red"; }' | prettier-standard --parser css

Warning: --lines flag should be considered experimental as prettier has issues with range formatting:

  • https://github.com/prettier/prettier/issues/4926
  • https://github.com/prettier/prettier/issues/6428

Examples

Typically you'll use this in your npm scripts (or package scripts):

{
  "scripts": {
    "format": "prettier-standard --format"
  }
}

We also encourage to use modern-node and lint-staged. You can configure it as follows:

{
  "scripts": {
    "precommit": "lint-staged"
  },
  "lint-staged": {
    "*": ["prettier-standard --lint"]
  }
}

NOTE: Unlike prettier this package simplifies your workflow by making --write flag a default, and allowing for passing code to stdin without additional --stdin flag.

Vim

It's probably best to use ale plugin. It supports multiple fixers, including prettier-standard:

Plug 'w0rp/ale'
let g:ale_fixers = {'javascript': ['prettier_standard']}
let g:ale_linters = {'javascript': ['']}
let g:ale_fix_on_save = 1

Sublime Text 3

It's possible to use 'prettier-standard' with Sublime Text 3.

  1. Install 'prettier-standard' globally according to the installation instructions above.
  2. Find the location of your installed executable file. On a unix based system (like MacOS):
$ which prettier-standard
  1. Copy the location. (e.g. /usr/local/bin/prettier-standard)
  2. Install SublimeJsPrettier according to their installation instructions.
  3. Open SublimeJsPrettier's default settings in Sublime and copy the line: "prettier_cli_path": ""
  4. Open SublimeJsPrettier's user settings in Sublime and add the line with the correct location of the 'prettier-standard' executable.
{
  "prettier_cli_path": "/usr/local/bin/prettier-standard"
}

You can now use 'prettier-standard' in Sublime Text 3 by opening the Command Palette (super + shift + p) and typing JsPrettier: Format Code.

Customizing

You can use .prettierrc for overriding some options, e.g to use semistandard:

{
  "semi": true
}

You can also configure linting by creating appropriate .eslintrc file that will override defaults:

{
  "rules": {
    "eqeqeq": "off"
  }
}

Prettier-standard includes following packages so you don't need to install them in your repository:

  • eslint
  • @babel/core
  • @babel/eslint-parser
  • eslint-config-prettier
  • eslint-config-standard
  • eslint-config-standard-jsx
  • eslint-config-standard-react
  • eslint-config-standard-with-typescript
  • eslint-plugin-import
  • eslint-plugin-jest
  • eslint-plugin-n
  • eslint-plugin-promise
  • eslint-plugin-react
  • eslint-plugin-react-hooks
  • eslint-plugin-standard
  • @typescript-eslint/eslint-plugin
  • @typescript-eslint/parser

Ignoring Files

You can use .prettierignore file for ignoring any files to format, e.g:

dist
.next
**/*.ts

You can also use .eslintignore to format some files, but prevent linting others.

API

prettier-standard exposes the same API as prettier: https://prettier.io/docs/en/api.html

It also exposes one additional method that works similarly to its CLI:

run(cwd, config)

  • cwd - path where to execute prettier-standard
  • config - object configuring execution
    • patterns - patterns to use for formatting files (array of strings)
    • check - whether to check instead of format files (boolean, default: false)
    • lint - whether to perform linting (boolean, default: false)
    • changed - whether to format only changed lines (boolean, experimental, default: false)
    • since - format changes that happened since given branch (string, optional, example: "master")
    • onProcess - callback that is called for each processed file matching pattern: { file, formatted, check, runtime }

LICENSE

MIT