Is a good convention using semicolon at the end of the line when using ES6 in babel [duplicate]

Question

I saw several examples on the web of tutorials using redux and react where the code of omitting the semicolon when using es6 with babel.

Example semicolon at the end of import, export.

• What is the reason?
• What is a good practice?

Missing semicolon

---

import React, { PropTypes } from 'react'

const Location = ({ onClick, name, country}) => (
    <li
        onClick={onClick}
    >
        {name} {country}
    </li>
)

export default Location

---

vs with semicolon

---

import React, { PropTypes } from 'react';

const Location = ({ onClick, name, country}) => (
    <li
        onClick={onClick}
    >
        {name} {country}
    </li>
);

export default Location;

Answer 1

Referring to ASI section of ES documentation confirms the following.

Most ECMAScript statements and declarations must be terminated with a semicolon. Such semicolons may always appear explicitly in the source text. For convenience, however, such semicolons may be omitted from the source text in certain situations. These situations are described by saying that semicolons are automatically inserted into the source code token stream in those situations.

In your case, ES6 is being used through babel. It's a transpiler and it may add the missed semicolons in the process of transpiling the source text to native JS.

IMO, good practice is to enable ES linter and it can help to avoid most of the silly mistakes that can culminate the application in undefined state at later point in the time line.

This link can give you some more information.