import-js/eslint-plugin-import

[dynamic-import-chunkname] webpackChunkName should be optional when webpackMode: "eager"

Open

#1,904 opened on Sep 18, 2020

 (1 comment) (0 reactions) (0 assignees)JavaScript (1,548 forks)batch import
enhancementhelp wanted

Repository metrics

Stars
 (5,940 stars)
PR merge metrics
 (PR metrics pending)

Description

Code

import(
  /* webpackMode: "eager" */ '../a-module-that-requires-some-time-to-initialize'
)

Expected result

(No warning)

Actual result

dynamic imports require a leading comment in the form /* webpackChunkName: "[a-zA-Z0-9-/_]+",? */ eslint(import/dynamic-import-chunkname)

Description

From the docs:

'eager': Generates no extra chunk. All modules are included in the current chunk and no additional network requests are made. A Promise is still returned but is already resolved. In contrast to a static import, the module isn't executed until the call to import() is made.

/* webpackMode: "eager" */ is handy when you want to include a module in the same chunk, but do not want to execute it when the chunk is initially loaded.

Workaround

// See https://github.com/benmosher/eslint-plugin-import/issues/1904
// eslint-disable-next-line import/dynamic-import-chunkname
import(
  /* webpackMode: "eager" */ '../a-module-that-requires-some-time-to-initialize'
)

Contributor guide