Skip to content

No env specific bundle for ESM#142

Merged
jaredpalmer merged 7 commits into
jaredpalmer:masterfrom
danielkcz:cjs-env-common-bundle
Jun 18, 2019
Merged

No env specific bundle for ESM#142
jaredpalmer merged 7 commits into
jaredpalmer:masterfrom
danielkcz:cjs-env-common-bundle

Conversation

@danielkcz

@danielkcz danielkcz commented Jun 12, 2019

Copy link
Copy Markdown
Contributor

Fixes #140

An alternative (and correct) approach based on a discussion in #141

I've kept index.js which points to a single name.cjs.js file to keep breaking changes at a minimum. It could probably be removed eventually.

Besides some slight cleanup, the major change is a single ESM build that isn't env specific. Production bundles also get the .min in the name.

@danielkcz

Copy link
Copy Markdown
Contributor Author

Btw, I've noticed that for watch command it includes umd for format defaults while in build only cjs,es is by default. Looks like an oversight. Shall I fix it here as well?

Comment thread src/index.ts Outdated
opts.name = opts.name || appPackageJson.name;
opts.input = await getInputs(opts.entry, appPackageJson.source);
const buildConfigs = createBuildConfigs(opts);
await util.promisify(mkdirp)(resolveApp('dist'));

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

I haven't fully understood why this line was originally inside the condition. Why it shouldn't be creating dist folder no matter of what format is chosen?

@danielkcz

Copy link
Copy Markdown
Contributor Author

Perhaps I should also rename those umd bundles as drafted in #141 (comment)? It would be breaking change unless making alias files for that as well.

On the other hand, having .min (or not) does not tell the story that it's actually a production build. If something is minified is not that relevant and it's apparent from the first look at the file.

@TrySound

Copy link
Copy Markdown
Collaborator

I think UMD story similar to react is ok too.

@TrySound

Copy link
Copy Markdown
Collaborator

I would recommend to rename es into esm. Rollup supports both formats. es has different meaning in some projects. For example material-ui uses it for es6 syntax (not only for esm).

@danielkcz

danielkcz commented Jun 13, 2019

Copy link
Copy Markdown
Contributor Author

@TrySound Well, in that case I would have to change the whole --format esm option which is another breaking change. Is that ok?

Also, React actually has env specific CJS bundles. Perhaps it makes sense there?

@TrySound

Copy link
Copy Markdown
Collaborator

Yeah, both umd and cjs are ok. The problem only esm bundle right now. @FredyC I think from tsdx point of view it can support both. es is an alias.

@danielkcz danielkcz changed the title No env specific bundles (except for CJS) No env specific bundle for ESM Jun 13, 2019
@danielkcz

Copy link
Copy Markdown
Contributor Author

Alright, another version. The CJS is back in both dev/prod builds. It also adds min to a production builds. The ES format now outputs like dist/build-default.esm.js without running replace. It's possible to input format as "es" or "esm", it gets normalized.

@danielkcz danielkcz force-pushed the cjs-env-common-bundle branch from 83625ad to 97fe66f Compare June 13, 2019 08:33
@danielkcz danielkcz force-pushed the cjs-env-common-bundle branch from 97fe66f to 756250a Compare June 13, 2019 08:33
Comment thread src/createRollupConfig.ts
)}.${format}.${env}.js`,
file: outputName,
// Pass through the file format
format,

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

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

You may add the same condition here to highlight migration to esm

@danielkcz danielkcz Jun 13, 2019

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

Well, I am not sure to call it a migration. The babel plugin expects the "es" only (according to typings). Strangely enough, the rollup expects "esm" in the format option. I wonder how is it possible it actually worked till now. It's a bit of mess.

https://rollupjs.org/guide/en#command-line-flags

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

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

Babel do not use es value anywhere. The type is defined in this module.

@danielkcz danielkcz Jun 13, 2019

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

Format is being passed to Babel in here, but who knows what's its purpose there https://github.com/palmerhq/tsdx/blob/943648edb06cd131f2c1751120cd1301804b480b/src/createRollupConfig.ts#L163

Either way, I've used the same condition for a rollup format.

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

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

I mean babelOptions is defined here too. Format is only used to check non-commonjs
https://github.com/palmerhq/tsdx/blob/d111c131a5e5cf19d62b98e123060c2ab55c43da/src/createRollupConfig.ts#L16-L50

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

Doh! How could I've missed that :) Ok, it's now consolidated as "esm" everywhere with a check for "es" to avoid breakage.

@danielkcz danielkcz force-pushed the cjs-env-common-bundle branch from f6a89c5 to 175c544 Compare June 13, 2019 11:41
@danielkcz

Copy link
Copy Markdown
Contributor Author

So...anything else missing here? Would like to get it out soon-ish so we can publish a fixed package. I am kinda surprised that nobody else noticed it yet considering that Webpack grabs the ESM build by default.

@TrySound

Copy link
Copy Markdown
Collaborator

Latest release of formik uses old build. I guess that's why no one noticed.

Comment thread src/index.ts Outdated
@danielkcz

Copy link
Copy Markdown
Contributor Author

Can you release it this week, please?

@jaredpalmer

Copy link
Copy Markdown
Owner

Yup. On it meow.

@jaredpalmer jaredpalmer merged commit 0f9d964 into jaredpalmer:master Jun 18, 2019
@danielkcz danielkcz deleted the cjs-env-common-bundle branch June 18, 2019 17:29
@agilgur5

agilgur5 commented Mar 11, 2020

Copy link
Copy Markdown
Collaborator

@allcontributors please add @FredyC for code, docs, test, ideas, bug

@allcontributors

Copy link
Copy Markdown
Contributor

@agilgur5

I've put up a pull request to add @FredyC! 🎉

@agilgur5

Copy link
Copy Markdown
Collaborator

@allcontributors please add @TrySound for review, questions, ideas

@allcontributors

Copy link
Copy Markdown
Contributor

@agilgur5

I've put up a pull request to add @TrySound! 🎉

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Production bundle for ES format is not enough for a development

4 participants