fix(lib): use proper extension #6827

sachinraja · 2022-02-09T15:02:32Z

Description

Library mode currently emits .js extensions for all formats, but this is not Node compliant. It should emit .mjs for es formats and .js for cjs formats with "type": "commonjs" and .js for es formats and .cjs for cjs formats with "type": "module".

Additional context

The current default es extension will break in Vitest and will need to be inlined.

What is the purpose of this pull request?

Bug fix
New Feature
Documentation update
Other

Before submitting the PR, please make sure you do the following

Read the Contributing Guidelines.
Read the Pull Request Guidelines and follow the Commit Convention.
Check that there isn't already a PR that solves the problem the same way to avoid creating a duplicate.
Provide a description in this PR that addresses what the PR is solving, or reference the issue that it solves (e.g. fixes #123).
Ideally, include relevant tests that fail without this PR but pass with it.

sachinraja · 2022-02-09T15:04:29Z

packages/vite/src/node/build.ts

@@ -681,7 +681,8 @@ export function resolveLibFilename(
      'Name in package.json is required if option "build.lib.fileName" is not provided.'
    )

-  return `${name}.${format}.js`
+  const extension = format === 'es' ? 'mjs' : 'js'


This only checks for es format now, but it could check if the format includes es to support #6555

bluwy · 2022-02-09T15:27:09Z

Nice! Just noticed this quirk in the docs today as well. For detecting extensions, I think we should base on type: module from package.json instead, and choose the correct extension between .mjs, .js, and .cjs.

sachinraja · 2022-02-09T15:41:53Z

For detecting extensions, I think we should base on type: module from package.json instead, and choose the correct extension between .mjs, .js, and .cjs.

Good idea, just implemented that. I'll add a few tests for it later.

packages/vite/src/node/build.ts

patak-dev · 2022-02-09T20:14:29Z

LGTM @sachinraja! Just to be safe, let's merge this one during the 2.9 beta so we give the chance to ecosystem players to test it. I don't think this should be an issue, but changing the extension of the lib output feels too big for a patch.

bluwy · 2022-02-11T04:44:50Z

Come to think of it, I think this is a breaking change and should be released in a major. If existing libraries rely on the default output path and upgraded Vite, the publishing would be incorrect.

sachinraja · 2022-02-11T14:21:07Z

I'm not sure this will actually affect a lot of people considering the docs recommended using a custom fileName function, but I would also say this is a breaking change.

sachinraja · 2022-02-12T01:59:08Z

Could this be released under a config option like emitNodeCompliantExtensions? I think it'd be good to get this fix out as soon as possible, there are already too many packages that don't use the correct extensions.

bluwy · 2022-02-13T04:13:38Z

I don't think it's necessary to add a new option for this. But at the meantime, we could make a separate PR to update the docs regarding using proper extensions too.

patak-dev · 2022-02-25T16:46:47Z

@sachinraja we talked about this PR with the team, and we would like to merge it but we should wait until Vite 3.0 because of the breaking change.

In the meantime, we need to review the naming because the es. and cjs. prefixes are no longer needed if we use .mjs and .cjs

sachinraja · 2022-02-25T23:17:35Z

Sounds good. I think removing the format prefixes for esm and cjs and would be good, if everyone agrees.

mangs · 2022-04-27T18:58:11Z

This is great news! I've been using a custom Rollup config to workaround this for a frontend project until now, so I'm curious can this be exposed for browser-based projects too (<script type="module">)?

I prefer it for clarity purposes and it allows for easier use in isomorphic projects (Node.js and in the browser), but there is apparently the downside of MIME type support by legacy web servers (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Modules#aside_%E2%80%94_.mjs_versus_.js). I'd love this to be the default behavior, but it may be a bad choice to do so for those unaware of the potential broken rendering due to missing MIME type for .mjs files. Then again, the popularity of this project could push the ecosystem to evolve to support it; I'm open to either. What are your thoughts? I'm sure I'm not alone in this.

And of course thank you for making such a great tool. 😀

sachinraja · 2022-04-29T12:53:14Z

@mangs I'm not sure if they've discussed that already but I think it would be better to create a separate issue for that.

mangs · 2022-04-29T16:27:48Z

OK I will, thank you for the feedback

mangs · 2022-04-29T16:41:49Z

Filed an issue here: #7963

fix: use proper extension in library mode

85ceb65

sachinraja commented Feb 9, 2022

View reviewed changes

sachinraja added 2 commits February 9, 2022 07:16

fix: tests and change .es.js to .es.mjs

d368525

fix: update a few tests

c02ed19

fix: change extension based on package.json "type"

55c2221

Niputi added the feat: library mode label Feb 9, 2022

sachinraja added 2 commits February 9, 2022 07:45

chore: import from './packages'

6406ba9

fix: resolve config tests

9663483

bluwy reviewed Feb 9, 2022

View reviewed changes

packages/vite/src/node/build.ts Outdated Show resolved Hide resolved

patak-dev added this to the 2.9 milestone Feb 9, 2022

sachinraja added 3 commits February 9, 2022 15:20

fix: .js file extension for iife

4e01b16

docs: update example to only use string fileName

0cd59a4

test: package extensions

9775e70

patak-dev added the p3-minor-bug An edge case that only affects very specific usage (priority) label Feb 12, 2022

Niputi changed the title ~~fix: use proper extension in library mode~~ fix(lib): use proper extension Feb 22, 2022

Niputi mentioned this pull request Feb 22, 2022

feat(lib): allow multiple entries #7047

Merged

9 tasks

patak-dev modified the milestones: 2.9, 3.0 Feb 25, 2022

patak-dev mentioned this pull request Apr 13, 2022

docs: Use .mjs extension for library ESM bundle #7714

Closed

4 tasks

cdauth mentioned this pull request Apr 16, 2022

[#20] Support .mjs and .cjs file extension marco-prontera/vite-plugin-css-injected-by-js#19

Merged

marco-prontera mentioned this pull request Apr 16, 2022

Support .mjs and .cjs file extension marco-prontera/vite-plugin-css-injected-by-js#20

Closed

mangs mentioned this pull request Apr 29, 2022

Add an option for .mjs file output for browser-based projects #7963

Closed

4 tasks

Merge branch 'main' into lib-mode-extension

a1f080d

bluwy approved these changes May 5, 2022

View reviewed changes

patak-dev merged commit 34df307 into vitejs:main May 5, 2022

sachinraja deleted the lib-mode-extension branch May 10, 2022 22:23

sachinraja mentioned this pull request May 10, 2022

fix(lib)!: remove format prefixes for cjs and esm #8107

Merged

9 tasks

This was referenced May 29, 2022

feat: default esm SSR build, simplified externalization #8348

Merged

feat: derive proper js extension from package type #8382

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

fix(lib): use proper extension #6827

fix(lib): use proper extension #6827

sachinraja commented Feb 9, 2022 •

edited

Loading

sachinraja Feb 9, 2022

bluwy commented Feb 9, 2022

sachinraja commented Feb 9, 2022

patak-dev commented Feb 9, 2022

bluwy commented Feb 11, 2022

sachinraja commented Feb 11, 2022 •

edited

Loading

sachinraja commented Feb 12, 2022 •

edited

Loading

bluwy commented Feb 13, 2022

patak-dev commented Feb 25, 2022

sachinraja commented Feb 25, 2022

mangs commented Apr 27, 2022 •

edited

Loading

sachinraja commented Apr 29, 2022

mangs commented Apr 29, 2022

mangs commented Apr 29, 2022

fix(lib): use proper extension #6827

fix(lib): use proper extension #6827

Conversation

sachinraja commented Feb 9, 2022 • edited Loading

Description

Additional context

What is the purpose of this pull request?

Before submitting the PR, please make sure you do the following

sachinraja Feb 9, 2022

Choose a reason for hiding this comment

bluwy commented Feb 9, 2022

sachinraja commented Feb 9, 2022

patak-dev commented Feb 9, 2022

bluwy commented Feb 11, 2022

sachinraja commented Feb 11, 2022 • edited Loading

sachinraja commented Feb 12, 2022 • edited Loading

bluwy commented Feb 13, 2022

patak-dev commented Feb 25, 2022

sachinraja commented Feb 25, 2022

mangs commented Apr 27, 2022 • edited Loading

sachinraja commented Apr 29, 2022

mangs commented Apr 29, 2022

mangs commented Apr 29, 2022

sachinraja commented Feb 9, 2022 •

edited

Loading

sachinraja commented Feb 11, 2022 •

edited

Loading

sachinraja commented Feb 12, 2022 •

edited

Loading

mangs commented Apr 27, 2022 •

edited

Loading