Comments (3)
Hey! The Webpack feature that you want to use should be set in your webpack.config.js
file, not taken from the library package.json
. Look at the docs, where you can find code example:
module.exports = {
//...
resolve: {
mainFields: ['browser', 'module', 'main']
}
};
While libraries should contain one of the following fields: "main", "module" or "browser". The first two are in hybrids package.json
. The last one is not relevant, as the library is pure for the browsers only.
Moreover, what you want to do is something, that should be avoided. Built version of the library is only here for those who have to use it directly by <script>
tag. It also doesn't include HMR support and has less verbose errors - it is only for production usage.
If you use Webpack, you should leave default behavior of the Webpack configuration (without set mainFields) and import library like this:
import { define } from 'hybrids';
Even with this code, you don't have to transpile code to es5 as it is traspiled already. Only src
path has ES2015 syntax.
To sum up, this is the mapping from package.json
:
module
:esm/index.js
- ES5 withimport
/export
syntaxmain
:lib/index.js
- es5 with commonjsdist/hybrids.js
- no entry inpackage.json
- only for CDN likehttps://unpkg.com/hybrids/dist/hybrids.js
Feel free to re-open, if you have other questions related to this subject.
from hybrids.
Thanks for the clarification .I originally raised this question so as to have less bundle size for prod but webpack can minify the es6 module i guess. I have more clarity now, but one doubt.
It also doesn't include HMR support and has less verbose errors - it is only for production usage.
I am using webpack not for transpiling but for bundling (with two configuration dev and prod). If i bundle the code as is with import will i be getting HMR in prod code also? if yes then i how can i turn it off ?
from hybrids.
You don't have to worry. The library uses process.env.NODE_ENV
value, which is provided by the Webpack and other bundlers. If you use production mode in Webpack it removes all not necessary code for production use.
from hybrids.
Related Issues (20)
- how to create a component method HOT 4
- how to implement focus management? HOT 4
- Bug: Template is not updated when component properties change HOT 14
- How to add focus when opening a form? HOT 4
- I can't write a polymorphic model definition for GeoJson objects HOT 7
- Content is not updated when creating a model HOT 2
- Using "store([Model])" causes a TypeScript error HOT 18
- Clearing a draft causes a TypeScript error. HOT 7
- "children" fabric causes TypeScript error HOT 4
- using 'host.render()' and 'host.content()' causes a TypeScript error HOT 4
- The "store(Model, { id: value })" descriptor does not resolve "id" correctly to the model instance. HOT 3
- The "store(Model, { id:value })" descriptor does not work correctly. HOT 2
- Add a helper for assigning component properties HOT 3
- Dynamic columns not showing when render a html table HOT 4
- '"hybrids"' has no exported member named 'property'. Did you mean 'Property'? HOT 8
- Add support for "TypeScript v5" HOT 3
- I can't create an arbitrary number of nested forms: HOT 6
- Small Type Inferencing Issue with Property<E, V> HOT 3
- Cannot pass an object to the API via the "list" method HOT 7
- version 8.2.17 backwards compatibility is broken! HOT 9
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from hybrids.