CODEWITHSUNDEEP
javascriptecmascript-6
June
June

Reputation: 2217

How to break long import statements into multiple lines in ES6?

I have a pretty long import statement in my JavaScript (ES6) file:

import { A, B, C, D } from '../path/to/my/module/in/very/far/directory/'

Is it OK to add new lines like this?

import { A, B, C, D } from
'../path/to/my/module/in/very/far/directory'

If not, is there any other way to write clean (keeping my code within 80 columns) import statements in ES6 syntax using Babel?

Upvotes: 17

Views: 11709

Answers (3)

Abdullah
Abdullah

Reputation: 249

You can use following syntax:

import {
  CanActivate, CanActivateChild, CanDeactivate, CanLoad, Route,
  UrlSegment, ActivatedRouteSnapshot, RouterStateSnapshot, UrlTree
} from '@angular/router';

Upvotes: 0

Bergi
Bergi

Reputation: 665574

Yes, the ES6 spec does allow whitespace - which includes newlines - between every token (unless otherwise restricted). Automatic semicolon insertion will not mess with you inside of import declarations either, so you're free to do

import
{
A
,
B
,
C
,
D
}
from
'../path/to/my/module/in/very/far/directory/'
;

or anything that is less extreme and better indented :-)

Upvotes: 7

nyumerics
nyumerics

Reputation: 6547

Here are the results from my test using ESLint.

ESLINT PASSED

import fs
from 'fs';

ESLINT PASSED

import
fs
from 
'fs';

ESLINT PASSED

import {
    moduleName
} from './my/module/file';

And the above code executes fine. I think you are good to go!

NOTE: This .eslintrc was used.

Upvotes: 19

Related Questions