Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

fix(plugin-legacy): turn off babel loose mode #3406

Merged
merged 2 commits into from
May 17, 2021
Merged

fix(plugin-legacy): turn off babel loose mode #3406

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
732120a
fix: turn off babel loose mode
nihalgonsalves May 13, 2021
bd10d60
test: add set down-transpile test
nihalgonsalves May 13, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions packages/playground/legacy/__tests__/legacy.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,3 +7,8 @@ test('should work', async () => {
test('import.meta.env.LEGACY', async () => {
expect(await page.textContent('#env')).toMatch(isBuild ? 'true' : 'false')
})

// https://github.com/vitejs/vite/issues/3400
test('transpiles down iterators correctly', async () => {
expect(await page.textContent('#iterators')).toMatch('hello')
})
1 change: 1 addition & 0 deletions packages/playground/legacy/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
<h1 id="app"></h1>
<div id="env"></div>
<div id="iterators"></div>
<script type="module" src="./main.js"></script>
6 changes: 6 additions & 0 deletions packages/playground/legacy/main.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,3 +15,9 @@ if (import.meta.env.LEGACY) {
}

document.getElementById('env').textContent = `is legacy: ${isLegacy}`

// Iterators

document.getElementById('iterators').textContent = [...new Set(['hello'])].join(
''
)
2 changes: 1 addition & 1 deletion packages/plugin-legacy/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -248,7 +248,7 @@ function viteLegacyPlugin(options = {}) {
targets,
modules: false,
bugfixes: true,
loose: true,
loose: false,
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

suggestion (idea): Don't know if it's useful in anycase or why we need to set loose mode to false here, but on some places we already often have the possibility to let users decide to override such options 🤔
So we may do something like loose: options.babelTransformOptions?.loose ?? false here, could we?
Maybe there is also a better name than babelTransformOptions

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah, but perhaps it's better to wait for someone to explicitly request it? Feels like you should use loose mode only in specific situations (i.e. your own code, where you know that you don't need the stricter mode).

But since you don't know what syntax every dependency uses, it's unlikely to be a good idea to transpile your entire bundle through loose mode.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

loose mode equals false seems to generate much more output code and if you don't use this [...new Set()] in any way, you are not affected by it but now forced by Vite to live with this more generated output for other stuff 🤔
Also you can workaround it by not using [...new Set()] but [].concat(Array.from(new Set())) + using a polyfill for Array.from

Copy link
Member Author

@nihalgonsalves nihalgonsalves May 13, 2021 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I know that it generates a bigger bundle, but this code comes from Vue itself. So that's a pretty common case for Vite users, and not something you can work around like in your own code.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

With loose: options.babelTransformOptions?.loose ?? false false would be the new default, nothing against this
But we let users that are not in this specific context decide and prevent regression in any case for them if they want to
It's downwards compatible / non-breaking with an option
And later we may also use it for e.g. let users override any options with using { /*...*/, ...(options.babelTransformOptions ?? {}) }

So all in all, it's just the possibility to not break anything if there are any breaking changes we currently oversee

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Maybe it's babelTransformEnvOptions?

useBuiltIns: needPolyfills ? 'usage' : false,
corejs: needPolyfills
? { version: 3, proposals: false }
Expand Down