index.html — vite Source File

Source Code

<h1>Optimize Deps</h1>

<h2>CommonJS w/ named imports (react)</h2>
<div class="cjs"></div>
<h2>CommonJS w/ named imports (phoenix)</h2>
<div class="cjs-phoenix">fail</div>
<h2>CommonJS w/ default export (clipboard)</h2>
<div class="cjs-clipboard">fail</div>
<h2>CommonJS w/ default export (dep-cjs-with-es-module-flag)</h2>
<div class="cjs-with-es-module-flag">fail</div>
<h2>CommonJS import default (dep-cjs-compiled-from-esm)</h2>
<div class="cjs-dep-cjs-compiled-from-esm"></div>
<h2>CommonJS import default (dep-cjs-compiled-from-cjs)</h2>
<div class="cjs-dep-cjs-compiled-from-cjs"></div>

<script type="module" src="./cjs.js"></script>

<h2>CommonJS dynamic import default + named (react)</h2>
<div class="cjs-dynamic"></div>
<h2>CommonJS dynamic import named (phoenix)</h2>
<div class="cjs-dynamic-phoenix"></div>
<h2>CommonJS dynamic import default (clipboard)</h2>
<div class="cjs-dynamic-clipboard"></div>
<h2>CommonJS dynamic import default (dep-cjs-compiled-from-esm)</h2>
<div class="cjs-dynamic-dep-cjs-compiled-from-esm"></div>
<h2>CommonJS dynamic import default (dep-cjs-compiled-from-cjs)</h2>
<div class="cjs-dynamic-dep-cjs-compiled-from-cjs"></div>
<h2>CommonJS dynamic import default (dep-cjs-with-es-module-flag)</h2>
<div class="cjs-dynamic-dep-cjs-with-es-module-flag"></div>

<script type="module" src="./cjs-dynamic.js"></script>

<h2>Dedupe (dep in linked & optimized package)</h2>
<div class="dedupe"></div>
<script type="module" src="./dedupe.js"></script>

<h2>CommonJS w/ browser field mapping (axios)</h2>
<div>This should show pong: <span class="cjs-browser-field"></span></div>

<h2>CommonJS w/ bare id browser field mapping</h2>
<div>This should show pong: <span class="cjs-browser-field-bare"></span></div>

<h2>Detecting linked src package and optimizing its deps (lodash-es)</h2>
<div>This should show fooBarBaz: <span class="deps-linked"></span></div>

<h2>Optimizing force included dep even when it's linked</h2>
<div class="force-include"></div>

<h2>Dep with CSS</h2>
<div class="dep-linked-include">This should be red</div>

<h2>CJS Dep with CSS</h2>
<div class="cjs-with-assets">This should be blue</div>

<h2>import * as ...</h2>
<div class="import-star"></div>

<h2>Import from dependency with process.env.NODE_ENV</h2>
<div class="node-env"></div>

// ... (355 more lines)