Releases: ionic-team/stencil
🦂 2.1.0-2
🎳 2.1.0-1
🛳 2.1.0-0
Features
- deps: update to puppeteer 5.3.0, node-fetch 2.6.1, open 7.2.1 (03decfa)
- deps: update to rollup 2.27.0 and terser 5.3.1 (21a10c9)
- dev-server: add ssr option for dev server for prerending dev (2574094)
- e2e: e2e timeout configurable (8b69731), closes #2662
- nodeRequire: export nodeRequire utility from compiler (10ea2fb)
- prerender: add buildId, hydrate externals, DOMContentLoaded (4d49c63)
- prerender: server-side only bundle modules w/ .server directory (d8fcb60)
Bug Fixes
- dev-server: improve exiting dev server process (eb02517)
- e2e: update to use page.waitForTimeout() (e48d306)
- mock-doc: do not pretty print whitespace senstive elements (de0dc65)
- mock-doc: provide mocked global fetch() fn (8fbc694)
- types: do not require @types/node because of puppeteer types (1a907f7)
- types: export h() function types (be20372)
🍮 2.0.3
🐡 2.0.2
👽 2.0.1
🚗 2.0.0
In keeping with Semver, Stencil 2.0.0
was released due to changes in the API (mainly from some updates to the config API). But even though this is a new major version, there are few breaking changes, and any changes will be flagged and described by the compiler during development. For the most part, most of the changes are removal of deprecated APIs that have been printing out warning logs for quite some time now.
Opt-in for IE11, Edge 16-18 and Safari 10 Builds
- config: update config extra defaults to not build IE11, Edge 16-18 and Safari 10 by default (363bf59)
A change in Stencil 2 is that the IE11, Edge 16-18 and Safari 10 builds will not be enabled by default. However, the ability to opt-in is still available, and can be enabled by setting each extras
config flag to true
. And advantages of this is less runtime within your builds. See the config.extras docs for more info.
Opt-in for ES5 and SystemJS Builds
- config: do not build es5 by default (fa67d97)
Just like having to opt-in for IE11, the same goes for opting-in for ES5 and SystemJS builds. For a production build in Stencil 1, it would build both ES2017/ESM files, and ES5/SystemJS files. As of Stencil 2, both dev and prod builds do not create ES5/SystemJS builds. An advantage of this is having faster production builds by not having to also downlevel to es5. See the buildEs5 for more info.
Use disconnectedCallback()
instead of componentDidUnload()
- componentDidUnload: use disconnectedCallback instead of componentDidUnload (4e45862)
When Stencil is used within other frameworks, DOM elements may be reused, making it impossible for componentDidUnload()
to be accurate 100% of the time if it is disconnected, then re-connected, and disconnected again. Instead, disconnectedCallback()
is the preferred way to always know if a component was disconnected from the DOM.
Note that the runtime still works for any collections that have been built with componentDidUnload(). However, updates to Stencil 2 will require it's changed to disconnectedCallback().
Default to async
task queue
- taskQueue: set "async" taskQueue as default (f3bb121)
Update taskQueue default to "async". Stencil 1 default was "congestionAsync". See config.taskQueue for more info.
Restore Stencil 1 defaults
export const config: Config = {
buildEs5: 'prod',
extras: {
cssVarsShim: true,
dynamicImportShim: true,
safari10: true,
shadowDomShim: true,
}
};
dist package.json
To ensure the extensions are built for the future and work with today's bundlers, we've found it best to use .cjs.js
extension for CommonJS files, and .js
for ESM files, with the idea that cjs files will no longer be needed some day, and the ESM files are the standard. (We were using .mjs
files, but not all of today's tooling and bundlers work well with that extension).
If you're using the dist
output target, update the package.json
in the root of your project, like this:
{
- "main": "dist/index.js",
+ "main": "dist/index.cjs.js",
- "module": "dist/index.mjs",
+ "module": "dist/index.js",
- "es2015": "dist/esm/index.mjs",
+ "es2015": "dist/esm/index.js",
- "es2017": "dist/esm/index.mjs",
+ "es2017": "dist/esm/index.js",
- "jsnext:main": "dist/esm/index.mjs",
+ "jsnext:main": "dist/esm/index.js",
}
Additionally the dist/loader
output directory has renamed its extensions too, but since its dist/loader/package.json
file is auto-generated, the entries were renamed too. So unless you were referencing the loader files directly you will not have to do external updates.
See the Output Folder Structure Defaults for more info.
NodeJS Update
- node: minimum of Node 12.10.0, recommend 14.5.0 or greater (55331be)
With the major release, now's a good time to update the minimum and recommended version of NodeJS.
TypeScript 4
- typescript: bundle typescript (1973032)
- typescript: update to typescript 4.0.0-beta (a274e11)
- typescript: update to typescript 4.0.1-rc (def2e6b)
- typescript: update to typescript 4.0.2 (f55f0bf)
The other change is the update to TypeScript 4. With Stencil 2, TypeScript will no longer be a dependency
, but instead included within the Stencil compiler. There are a few advantages to this we'll be experimenting with:
- Faster compiler startup times and overall smaller install size.
- The custom elements build should have a
dependency
of@stencil/core
, so not having TypeScript as a dependency of@stencil/core
simplifies the dependency graph for end-users and libraries. - Drastically simplifies the Stencil compiler by not having to dynamically import TypeScript, which quickly gets complicated since the compiler can work within Node, Deno, web workers and the browser's main thread. By bundling internally many of the complexities are no longer an issue.
- Stencil compiler guaranteed to run with the exact version of TypeScript it was designed with.
- Easier to adjust to breaking changes. For example, TypeScript 4 introduced a few breaking changes, but with this update it made it easier for the compiler to adjust internally.
Removal of Deprecated APIs
- assetsDir: remove deprecated component assetsDir (b5cba6a)
- attr: remove deprecated prop attr/reflectToAttr (133dd49)
- collection: remove deprecated collection parsing (1a94d1e)
- compiler: remove deprecated compile/compileSync (58a27d2)
- config: remove deprecated includeSrc/excludeSrc (c18cb1f)
- context: remove deprecated prop context/connect (a87b738)
- copy: remove deprecated copy config (6cf3134)
- docs: remove deprecated 'docs' type (043e2d8)
- experimental-dist-module: remove deprecated experimental-dist-module (41189a6)
- forceUpdate: remove deprecated elm.forceUpdate() (dfc1e59)
- legacyLoader: remove deprecated legacy loader (7480f92)
- listen: remove Listen target: 'parent' option (ed63707)
- listen: remove deprecated listen target (1a3b519)
- reflectToAttr: remove deprecated prop reflectToAttr (6eae6f8)
- prerender: use internal typescript (8f0bb51)
- test: do not require typescript for tests (43c5d98)
- test: remove deprecated testing configs (fb8a02b)
- transpile: remove deprecated "script" option (75dfebb)
- watch: remove deprecated PropWillChange/PropDidChange (fa2b400)
Removal of Context
The Context
object was originally added in the 0.x.x
versions of Stencil, before ES Modules were widely adopted. Since then we've deprecated it in Stencil 1, and have ported any external libraries off of it. The remaining one was @stencil/redux
, and we've released 0.2.0
to be used with Stencil 2 (and can also work with Stencil 1). Additionally, now might be a good time to look into using @stencil/store instead.
Bug Fixes
- *...
🎖 2.0.0-8
v2.0.0-8 🎖 2.0.0-8
♨️ 2.0.0-7
v2.0.0-7 ♨️ 2.0.0-7
🚑 2.0.0-6
v2.0.0-6 🚑 2.0.0-6