• Stars
    star
    304
  • Rank 137,274 (Top 3 %)
  • Language
    JavaScript
  • Created almost 10 years ago
  • Updated about 5 years ago

Reviews

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

Repository Details

To semicolon or not to semicolon; that is the question

Warning

Although this project should still work reasonably well, maintenance is no longer intended for this project since ESLint 2.x now supports the same functionality by using --fix command line flag with the semi rule.


Semi npm version Build Status

To semicolon or not to semicolon; that is the question

Add/remove semicolons from your JavaScript. Supports full ES6!

Why???

Because style.

On a more serious note, some people (including me) feel more comfortable and productive when writing JavaScript without semicolons. (If you disagree, read this) However, this is often not viable in a team environment, or when working on a project with established code style requirements.

As a solution to this problem, Semi can add semicolons to files written in a semicolon-less style, and can also remove semicolons from those written with semicolons. This allows you to write code in the style you like and just auto convert it before committing your code.

It was originally implemented by hacking jshint and now by using a custom rule for ESLint. Semi 100% preserves your original code formatting (other than semicolons). It even takes care of special cases where a newline semicolon is needed (see below).

Usage

CLI

npm install -g semi

Usage: semi [add|rm] [files...] [--out dir] [--leading] [--silent]

Options:

  --out      Output directory. If not specified, will overwrite original.
  --leading  Always add leading semicolons for lines that start with +-[(/.
  --silent   Suppress output messages.

API

var semi = require('semi')

// handle errors
semi.on('error', function (err) { /* ... */ })

// semi.add(<String>)
var jsWithSemicolons = semi.add(jsWithoutSemicolons)
// semi.remove(<String>)
var jsWithoutSemicolons = semi.remove(jsWithSemicolons, {
  leading: true
})

There's also Semi for SublimeText3!

It doesn't work!

If it doesn't seem to do anything, it's most likely because your code contains syntax errors.

Special Cases

Semi will automatically convert between the following two cases (also for newlines that start with [, +, - or a regex literal):

// A
var a = b;
(function () {
  /* ... */
})()
// B
var a = b
;(function () {
  /* ... */
})()

When leading option is true, it will add a leading semicolon for all newlines that start with one of those special tokens, even if the code is valid without the semicolon:

var a = 123;
++a;
// converts to:
var a = 123
;++a

However, it will not do anything to the following, because it is valid JavaScript and Semi cannot safely assume you wanted a semicolon there.

var a = b
(function () {
  /* ... */
})()

But Semicolons Are REQUIRED!!!

Semicolons in JavaScript are indeed optional. Now before you start to talk about how semicolons improve readibility simply because you also write other C-style languages, try to realize that JavaScript is not C, nor is it Java. Its semicolons are designed to be optional and dropping them can be a productivity boon for some people, including me. In fact, languages like Go and Groovy also have optional semicolons and the convention is not using them. You can even use semicolons in Ruby and Python, but obviously nobody does that because it's actually very easy to identify EOL as the end of a statement where it makes sense.

Now, if you are adding semicolons everywhere because you fear dropping them can cause mysterious bugs in some weird browsers, break minifiers, or the rules are simply too hard to remember, you are doing it wrong. The correct way to deal with FUD is to confront them and understand the root cause. You should read these following articles:

More Repositories

1

build-your-own-mint

Build your own personal finance analytics using Plaid, Google Sheets and CircleCI.
HTML
2,481
star
2

vue-hooks

Experimental React hooks implementation in Vue
JavaScript
1,595
star
3

pod

Git push deploy for Node.js
JavaScript
1,343
star
4

zoomerang

drop in zoom anything
JavaScript
1,221
star
5

vue-lit

Proof of concept custom elements "framework"
JavaScript
1,109
star
6

HTML5-Clear-v2

HTML5 Clear version 2
JavaScript
948
star
7

vite-vs-next-turbo-hmr

Benchmarking Vite vs. Next + turbopack HMR performance
JavaScript
920
star
8

laravel-vue-cli-3

Example project using Vue CLI 3 with Laravel
PHP
848
star
9

HTML5-Clear

[DEPRECATED] A replica of the Clear iphone app in HTML5
JavaScript
719
star
10

register-service-worker

A script to simplify service worker registration with hooks for common events.
JavaScript
640
star
11

vue-wordle

Wordle built with Vue, aka VVordle
TypeScript
584
star
12

launch-editor

Open file in editor from Node.js.
JavaScript
577
star
13

vue-svelte-size-analysis

Comparing generated code size of Vue and Svelte components
JavaScript
305
star
14

okie

Dead simple worker threads pool
TypeScript
263
star
15

starz

Count a GitHub user's total stars
JavaScript
145
star
16

circular-json-es6

circular JSON.stringify and JSON.parse, for environments with native ES6 Map
JavaScript
129
star
17

pug-plain-loader

webpack loader that transforms pug templates to plain HTML
JavaScript
116
star
18

release-tag

GitHub action for auto creating a release on tag push
JavaScript
109
star
19

Speech.js

Simple wrapper for Chrome's web speech recognition API
JavaScript
97
star
20

retweeter

Auto retweet from another account using CircleCI scheduled workflows
JavaScript
59
star
21

matrix.js

Featherweight CSS3 3D engine
JavaScript
58
star
22

buble

a fork of buble with some vue-specific hacks, used in vue-template-es2015-compiler
JavaScript
55
star
23

nightwatch-helpers

custom assertions and commands for easier nightwatch tests
JavaScript
53
star
24

shell-task

Proof-of-concept then-able shell commands in node.
JavaScript
46
star
25

creative-html5

A class about JavaScript, html5 and creative coding.
JavaScript
46
star
26

vue-template-explorer

See how vue templates get compiled into render functions under the hood
Vue
45
star
27

QR.js

Simple HTML5 Canvas-based QR Code generation
JavaScript
42
star
28

vue-tsc-3.3-type-repro

Vue
38
star
29

material-color-scheme-es6

Material Theme color scheme tweaked for ES6
JavaScript
32
star
30

semi-sublime

Sublime Text 3 plugin for Semi
Python
32
star
31

vite-pre-transform-test

JavaScript
30
star
32

speech

component for Chrome speech recognition wrapper
JavaScript
29
star
33

webpack-hmr-repro

JavaScript
28
star
34

raveal

Radially reveal an element
JavaScript
27
star
35

cjs-module-lexer-rollup-reexports

JavaScript
26
star
36

roetem

meteor-like experiment with vue and rethinkdb
JavaScript
24
star
37

gulp-component

component plugin for gulp
JavaScript
22
star
38

oxc-node-loader

JavaScript
22
star
39

tucao

吐槽专用
21
star
40

thread-loader-bug

JavaScript
21
star
41

rollup-tostringtag-symbol-conflict

JavaScript
20
star
42

resolve-type-test

TypeScript
20
star
43

browser-audio

Simple cross browser audio player
JavaScript
19
star
44

babel-preset-flow-vue

JavaScript
18
star
45

esbuild-exports-signature-repro

JavaScript
17
star
46

popSlides

javascript popup slideshow plugin based on jQuery
JavaScript
17
star
47

vue

vue bug
HTML
16
star
48

rollup-commonjs-bug

JavaScript
15
star
49

Puzzle-Demo

A slider puzzle game with CSS3 transitions.
JavaScript
14
star
50

capper

Capture canvas animations.
JavaScript
12
star
51

Socket-Play

iPhone-controlled HTML5 game concept demo
JavaScript
12
star
52

Kinect-Keylight

Kinect version of @hakimel 's Keylight
C++
11
star
53

showme

show me the code (for an npm package)
JavaScript
11
star
54

workerify

Component for easy inline web worker
JavaScript
10
star
55

de-indent

remove extra indent from a block of code
JavaScript
10
star
56

new

Scaffold a new project.
JavaScript
8
star
57

Telekinesis

User gesture input simulation.
JavaScript
8
star
58

whipcream

Chai-style chaining sugar for webdriverjs
JavaScript
8
star
59

babel-plugin-transform-es2015-classes-simple

JavaScript
7
star
60

emitter-fsm

EventEmitter based finite state machine
JavaScript
6
star
61

rolldown-dce-repro

JavaScript
5
star
62

templates

Personal project scaffolding templates
JavaScript
5
star
63

choreo.js

Event-based flow control for interactive walkthroughs
JavaScript
4
star
64

gulp-jscoverage

JSCoverage instrumentation plugin for gulp
JavaScript
4
star
65

fancytext

Text with fancy transitions
JavaScript
4
star
66

roller

One-dimensional touch scroller with momentum and elastic pagination
JavaScript
4
star
67

test-cli-preset

JavaScript
4
star
68

gruntfile-yaml

write grunt config in yaml.
JavaScript
4
star
69

generator-extension

A Chrome extension generator
JavaScript
3
star
70

blaze-local-state

Local reactive state for Blaze templates
JavaScript
3
star
71

generator-dude

A personal Yeoman generator
JavaScript
3
star
72

tester

webhook tests.
JavaScript
2
star
73

gulp-component-updater

Gulp-friendly module to auto add/delete files in your component.json
JavaScript
2
star
74

grunt-component-add

Automatically add files to component.json
JavaScript
1
star