Comments (6)
Prior to TypeScript 2.7, CommonJS modules that exported a function as the module (i.e. module.exports = function () { … }
) could not be imported as an ES module. This meant that it was not possible to import this type of modules ("callable CommonJS module") using ES module import syntax (e.g. import foo from 'foo'
or import * as foo from 'foo'
).
This changed in TypeScript 2.7 with the introduction of --esModuleInterop
that enables TypeScript modules to import "callable CommonJS modules" using ES module default import syntax.
This boils down to:
- If you're using TS 2.7 or newer with
--esModuleInterop
this module can be imported viaimport invariant from 'invariant';
- Otherwise you must use the
import invariant = require('invariant');
syntax.
from invariant.
@fbartho do you have babel in your build config? I have no problems with jest, because I have ts transpiler only, when I use it with webpack ts and babel, then I have an error invariant is not a function.
from invariant.
@maciejw Yes. I have both babel and webpack as I'm using ReactXP to target both web & react-native.
from invariant.
I have been able to work around this in our project by porting the code to TypeScript. Not sure if anybody would want that.
from invariant.
ok I have some info regarding subject.
https://www.typescriptlang.org/docs/handbook/declaration-files/library-structures.html
thats the reason I think
The Impact of ES6 on Module Call Signatures
Many popular libraries, such as Express, expose themselves as a callable function when imported. For example, the typical Express usage looks like this:import exp = require("express"); var app = exp();
In ES6 module loaders, the top-level object (here imported as exp) can only have properties; the top-level module object is never callable. The most common solution here is to define a default export for a callable/constructable object; some module loader shims will automatically detect this situation and replace the top-level object with the default export.
this is how invariant is exported
module.exports = invariant;
so bundler should shim it, this could be configuration issue,
or invariant library could add "module" next to "main" in package.json and export invariant function from another file correctly as es6 modules require it, default or named way, to resolve this
as a workaround require can be used, and then reexport using es6 syntax.
or we can PR this if this last solution is OK :)
from invariant.
I had to use allowSyntheticDefaultImports: true
in my config for import invariant from 'invariant'
to work (with TS version 2.7.2
).
from invariant.
Related Issues (20)
- No LICENSE file HOT 2
- Make message optional HOT 1
- 2.2.2 is somewhat broken... HOT 1
- Typical use case isn't well documented HOT 4
- Zero, the number should not throw HOT 1
- No PATENTS file ! HOT 3
- flow type definition more permissive than the actual code HOT 2
- Support ES Modules
- Question: is `process.env` possibly undefined? HOT 1
- Update license to MIT HOT 2
- The invariant message will be stripped in production? HOT 1
- not ok TypeError: "file" argument must be a non-empty string
- es module version?
- The `framesToPop` is puzzling me HOT 2
- Is there a specific reason to not allow `invariant(cond, message, ...args)` ? HOT 1
- Invariant Violation: Module is not a registered callable module (calling onShouldStartLoadWithRequest)
- The original intention of developing this library HOT 2
- Why?
- Audit vulnerabilities detected in the invariant project on Tag: v2.2.4
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 invariant.