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

Using minify:true caused exported namespace in IIFE build to not be available #5490

Closed
7 tasks done
cdiggins opened this issue Oct 31, 2021 · 1 comment · Fixed by #5715
Closed
7 tasks done

Using minify:true caused exported namespace in IIFE build to not be available #5490

cdiggins opened this issue Oct 31, 2021 · 1 comment · Fixed by #5715
Labels
pending triage

Comments

@cdiggins
Copy link

cdiggins commented Oct 31, 2021 •
edited
Loading

Describe the bug

We are building a browser based project. When including the IIFE in an HTML page, the "vim" namespace (see below) is only available when minify: false, otherwise we can't access the vim namespace.

import { defineConfig } from 'vite'
export default defineConfig({
  build: {
    lib: {
      formats: ['iife', 'es'],
      entry: './src/viewer.ts',
      name: 'vim'
    },
    // Minify set to true will break the IIFE output
    minify: false,
    rollupOptions: {
      external: [
        'three'
      ],
      output: {
        globals: {
          three: 'THREE'
        }
      }
    }
  }
})

Reproduction

I am not familiar enough with vite to create a proper reproduction, but I hope the problem is clear from the description. This happens in Chrome.

Our test HTML page (pushed into the dist folder) looks like the code below, and the problem is that "vim" is declared as undefined when Vite is built with minify:true in the config, but with minify:false, all seems to work well.

<body>
    <script src="https://unpkg.com/[email protected]/build/three.min.js"></script>
    <script src="vim-webgl-viewer.iife.js"></script>
    <script>
        const params = new URLSearchParams(window.location.search);
        const url = params.has('model')
            ? params.get('model')
            : 'https://vim.azureedge.net/samples/residence.vim';

        var viewer = new vim.Viewer({
            url: url,
            object: {
                rotation: { x: 270 },
            },
            plane: {
                show: false
            },
            showStats: true
        });
    </script> 
</body>

System Info

System:
    OS: Windows 10 10.0.19042
    CPU: (8) x64 Intel(R) Core(TM) i5-8265U CPU @ 1.60GHz
    Memory: 2.79 GB / 15.85 GB
  Binaries:
    Node: 14.16.1 - C:\Program Files\nodejs\node.EXE
    npm: 6.14.12 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: Spartan (44.19041.1266.0), Chromium (95.0.1020.40)
    Internet Explorer: 11.0.19041.1202
  npmPackages:
    vite: ^2.6.3 => 2.6.7

Used Package Manager

npm

Logs

No response

Validations
@cdiggins cdiggins mentioned this issue Oct 31, 2021
Closed
@Niputi
Copy link
Contributor

Niputi commented Oct 31, 2021

try setting minify to "terser"
this might be a esbuild bug

@cdiggins cdiggins mentioned this issue Nov 12, 2021
Closed
@hyrious hyrious mentioned this issue Nov 17, 2021
Merged
9 tasks
patak-dev pushed a commit that referenced this issue Nov 17, 2021
@hyrious
fix(build): keep IIFE name after minifying (fix #5490) (#5715)
1544211
@github-actions github-actions bot locked and limited conversation to collaborators Dec 2, 2021
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees
No one assigned
Labels
pending triage
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

fix(build): keep IIFE name after minifying (fix #5490)
2 participants
@cdiggins @Niputi