Ability to turn off transformation entirely?
I just want to get the file out of the package.
For example, I currently have: https://esm.sh/*ember-primitives/components/avatar?bundle=false&dev=&target=esnext&keep-names=true
which gets me
/* esm.sh - [email protected]/components/avatar */
export * from "/*[email protected]/X-aw/esnext/components/avatar.development.nobundle.mjs";
export { default } from "/*[email protected]/X-aw/esnext/components/avatar.development.nobundle.mjs";
which at https://esm.sh/*[email protected]/X-aw/esnext/components/avatar.development.nobundle.mjs is:
/* esm.sh - [email protected]/components/avatar */
var r=Object.defineProperty;var t=(s,o)=>r(s,"name",{value:o,configurable:!0});import{hash as n}from"@ember/helper";import{ReactiveImage as m}from"reactiveweb/image";import{WaitUntil as l}from"reactiveweb/wait-until";import{precompileTemplate as e}from"@ember/template-compilation";import{setComponentTemplate as a}from"@ember/component";import i from"@ember/component/template-only";var d=a(e(`
{{#unless @isLoaded}}
{{#let (WaitUntil @delayMs) as |delayFinished|}}
{{#if delayFinished}}
{{yield}}
{{/if}}
{{/let}}
{{/unless}}
`,{strictMode:!0,scope:t(()=>({WaitUntil:l}),"scope")}),i()),c=a(e(`
{{#if @isLoaded}}
<img alt="__missing__" ...attributes src={{@src}} />
{{/if}}
`,{strictMode:!0}),i()),v=a(e(`
{{#let (ReactiveImage @src) as |imgState|}}
<span data-prim-avatar ...attributes data-loading={{imgState.isLoading}} data-error={{imgState.isError}}>
{{yield (hash Image=(component Image src=@src isLoaded=imgState.isResolved) Fallback=(component Fallback isLoaded=imgState.isResolved) isLoading=imgState.isLoading isError=imgState.isError)}}
</span>
{{/let}}
`,{strictMode:!0,scope:t(()=>({ReactiveImage:m,hash:n,Image:c,Fallback:d}),"scope")}),i());export{v as Avatar,v as default};
//# sourceMappingURL=avatar.development.nobundle.mjs.map
but this isn't what I want.
Here is what is published on npm: https://www.npmjs.com/package/ember-primitives?activeTab=code (and GH)
import { hash } from '@ember/helper';
import { ReactiveImage } from 'reactiveweb/image';
import { WaitUntil } from 'reactiveweb/wait-until';
import { precompileTemplate } from '@ember/template-compilation';
import { setComponentTemplate } from '@ember/component';
import templateOnly from '@ember/component/template-only';
const Fallback = setComponentTemplate(precompileTemplate("\n {{#unless @isLoaded}}\n {{#let (WaitUntil @delayMs) as |delayFinished|}}\n {{#if delayFinished}}\n {{yield}}\n {{/if}}\n {{/let}}\n {{/unless}}\n", {
strictMode: true,
scope: () => ({
WaitUntil
})
}), templateOnly());
const Image = setComponentTemplate(precompileTemplate("\n {{#if @isLoaded}}\n <img alt=\"__missing__\" ...attributes src={{@src}} />\n {{/if}}\n", {
strictMode: true
}), templateOnly());
const Avatar = setComponentTemplate(precompileTemplate("\n {{#let (ReactiveImage @src) as |imgState|}}\n <span data-prim-avatar ...attributes data-loading={{imgState.isLoading}} data-error={{imgState.isError}}>\n {{yield (hash Image=(component Image src=@src isLoaded=imgState.isResolved) Fallback=(component Fallback isLoaded=imgState.isResolved) isLoading=imgState.isLoading isError=imgState.isError)}}\n </span>\n {{/let}}\n", {
strictMode: true,
scope: () => ({
ReactiveImage,
hash,
Image,
Fallback
})
}), templateOnly());
export { Avatar, Avatar as default };
//# sourceMappingURL=avatar.js.map
which I'd entirely prefer
- no minification
- easier to read
- variable names are kept
- no messing with Object.defineProperty / property polyfilling? what is going on?
no minification easier to read
the server minifies js by default to reduce network cast. i have the plan of adding a new option minify=false to disable the minifier
variable names are kept no messing with Object.defineProperty / property polyfilling? what is going on?
Object.defineProperty is added by esbuild, when the option keep-names present, which is out of my control. i also do not like this. There is a plan of improving the /*pkg pattern using esbuild's transform instead of build, which disables the code optimization feature
@NullVoxPopuli if you just want a CDN to serve a package file exactly as it's published, you should use the UNPKG CDN:
import Avatar from "https://unpkg.com/[email protected]/dist/components/avatar.js";
Only use esm.sh if you actually need transformations of the imported code; e.g. because the published package is in CJS and not ESM format.