Skip to content

fix(lib): esbuild helper functions injection not working with named exports #14539

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

Merged
bluwy merged 1 commit into from
Oct 9, 2023
Merged

fix(lib): esbuild helper functions injection not working with named exports #14539

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
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: 3 additions & 2 deletions packages/vite/src/node/plugins/esbuild.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,9 +25,10 @@ import type { Plugin } from '../plugin'

const debug = createDebugger('vite:esbuild')

// IIFE content looks like `var MyLib = function() {`. Spaces are removed when minified
// IIFE content looks like `var MyLib = function() {`.
// Spaces are removed and parameters are mangled when minified
const IIFE_BEGIN_RE =
/(const|var)\s+\S+\s*=\s*function\(\)\s*\{.*"use strict";/s
/(const|var)\s+\S+\s*=\s*function\([^()]*\)\s*\{\s*"use strict";/
Comment on lines -28 to +31
Copy link
Member Author

@sapphi-red sapphi-red Oct 5, 2023

Choose a reason for hiding this comment

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

.* needs to be replaced with \s* otherwise this test will fail.

vite/playground/lib/__tests__/lib.spec.ts

Lines 42 to 49 in 22bd67d

test('restrisct-helpers-injection', async () => {
const code = readFile(
'dist/helpers-injection/my-lib-custom-filename.iife.js',
)
expect(code).toMatch(
`'"use strict"; return (' + expressionSyntax + ").constructor;"`,
)
})

This fix relies on the fact that evanw/esbuild#3322 is fixed. But because that fix landed in 0.19.3, we cannot backport this fix to v4 directly.

We can use /(const|var)\s+\S+\s*=\s*function\([^()]*\)\s*\{[\s\w,;]*"use strict";/ instead of this regex to allow var _a, _b part that might be injected by esbuild. But I guess it's safer to simply revert #14094 for v4.


const validExtensionRE = /\.\w+$/
const jsxExtensionsRE = /\.(?:j|t)sx\b/
Expand Down
6 changes: 6 additions & 0 deletions playground/lib/__tests__/lib.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,11 +19,13 @@ describe.runIf(isBuild)('build', () => {
const noMinifyCode = readFile(
'dist/nominify/my-lib-custom-filename.umd.cjs',
)
const namedCode = readFile('dist/named/my-lib-named.umd.cjs')
// esbuild helpers are injected inside of the UMD wrapper
expect(code).toMatch(/^\(function\(/)
expect(noMinifyCode).toMatch(
/^\(function\(global.+?"use strict";var.+?function\smyLib\(/s,
)
expect(namedCode).toMatch(/^\(function\(/)
})

test('iife', async () => {
Expand All @@ -32,11 +34,15 @@ describe.runIf(isBuild)('build', () => {
const noMinifyCode = readFile(
'dist/nominify/my-lib-custom-filename.iife.js',
)
const namedCode = readFile('dist/named/my-lib-named.iife.js')
// esbuild helpers are injected inside of the IIFE wrapper
expect(code).toMatch(/^var MyLib=function\(\)\{\s*"use strict";/)
expect(noMinifyCode).toMatch(
/^var MyLib\s*=\s*function\(\)\s*\{\s*"use strict";/,
)
expect(namedCode).toMatch(
/^var MyLibNamed=function\([^()]+\)\{\s*"use strict";/,
)
})

test('restrisct-helpers-injection', async () => {
Expand Down
6 changes: 6 additions & 0 deletions playground/lib/__tests__/serve.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -82,6 +82,12 @@ export async function serve(): Promise<{ close(): Promise<void> }> {
),
})

await build({
root: rootDir,
logLevel: 'warn', // output esbuild warns
configFile: path.resolve(__dirname, '../vite.named-exports.config.js'),
})

// start static file server
const serve = sirv(path.resolve(rootDir, 'dist'))
const httpServer = http.createServer((req, res) => {
Expand Down
4 changes: 4 additions & 0 deletions playground/lib/src/main-named.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
export const foo = 'foo'

// Force esbuild spread helpers
console.log({ ...foo })
20 changes: 20 additions & 0 deletions playground/lib/vite.named-exports.config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
import path from 'node:path'
import { defineConfig } from 'vite'

export default defineConfig({
esbuild: {
supported: {
// Force esbuild inject helpers to test regex
'object-rest-spread': false,
},
},
build: {
lib: {
entry: path.resolve(__dirname, 'src/main-named.js'),
name: 'MyLibNamed',
formats: ['umd', 'iife'],
fileName: 'my-lib-named',
},
outDir: 'dist/named',
},
})