如何在ES6中将长的导入语句拆分成多行？

Question

我在JavaScript（ES6）文件中有一个相当长的导入语句：

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

像这样添加新行是否可以？

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

如果不能，那么是否有其他方法可以使用Babel以ES6语法编写干净的（将我的代码保持在80列内）导入语句？

- June

---

请阅读标签描述。babel是用于有同名Python库的问题。此外，这与Babel.js无关。 - Felix Kling

Answer 1

这是使用ESLint进行测试的结果。

ESLINT已通过

import fs
from 'fs';

ESLINT已通过

import
fs
from 
'fs';

ESLINT已通过

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

以上代码执行正常，我认为你可以继续进行！

注意: 使用了.eslintrc。

- activatedgeek

---

有没有任何配置，使得 eslint 无法通过？ - Bergi

但是如果文件路径非常长，我们如何打破它呢？这可能吗？ - Suyash Gupta

如果你有import {foo} from './longer_than_140_chars_path'，那该怎么办呢？是否有一种合法的语法可以将路径字符串分成两部分？ - Paul-Sebastian Manole

Answer 2

是的， ES6 规范允许在每个标记之间（除非另有限制）包括空格 - 包括换行符。自动分号插入也不会妨碍您在导入声明中使用，因此您可以自由地进行操作。

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

或者任何比较温和并且更好地缩进的内容 :-)

- Bergi

Answer 3

您可以使用以下语法：

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

- Abdullah