Background I’m trying to create a “buildless” JavaScript app, one where I don’t need a watch task running to transpile JSX, re-bundle code, etc every time I save any source file. It works fine with just first-party code, but I’m stuck when I try to import dependencies from npm. G…
Tag: es6-modules
ES module imports – can it always be done? A failed example trying to import socket.io-client
I’m trying to use a “build-less” process so I’m using a plain module script in an html file (following the Preact docs): I’m able to get the client socket.io working if I by-pass the module system and rely on the window global (note: I’m serving the html file from an http s…
How to make summary module that re-exports all the exports of sub-modules for ESM modules?
How do you re-export the exports from multiple files in an ESM module without listing each individual export separately? I have a CommonJS module directory that consists of a number of files that I would like to convert to ESM imports/exports. Currently, I have an index.js file that contains this: This re-exp…
Webpack ES6 modules multiple class app organization
I’m building an app with webpack for the first time and i’m trying to wrap my head around organizing class files. I’m having trouble getting the code to work. I’m still new to ES6 and such, so my code below is probably very wrong but i’m not sure its my approach/concept or its my…
ES6 modules – imported constants undefined if not in React component
The only similar question I have found is this one but I can’t see how would I have caused a circular dependancy in this case: I have a file exporting constants like so: (choices array version is for using in Select inputs and the other one secures from typing errors in condition checks) payments.consta…
Change property value initialized in constructor outside the class
//clazz.js: //main.js While I expect the num of the c will be 9, but it is still 8. What’s going one? And is it possible to fix that? Answer Replacing the .constructor property of the prototype object doesn’t help with anything. The constructor is Clazz itself, and you are calling it directly thro…
Using ES Modules with babel-standalone
Quoting babel docs https://babeljs.io/docs/en/babel-standalone#usage : “If you want to use your browser’s native support for ES Modules, you’d normally need to set a type=”module” attribute on your script tag. With @babel/standalone, set a data-type=”module” attribute…
Is there a way to “npm init” an ES module?
All modern versions of Node need to run packages as modules is “type”: “module” in package.json, but I don’t see any flags for npm init or yarn init that will add that property. Is there a flag for either package manager or an easy way to add the value to package.json (i.e., npm …
How would I import a custom web component asynchronously?
I have made my custom input element (modern text input for forms) into a web component. The .js file that I made to implement it has three parts. The HTML Template: The Element’s Class Declaration: Lastly, The Method That Associates the Custom Element to a Tag Name: Question: I am worried that using <…
Import ‘.json’ extension in ES6 Node.js throws an error
We’re trying to use the new ways of exporting and importing modules for ES6 with Node.js. It’s important for us to get the version number from the package.json file. The following code should do that: However, on execution the following error is thrown: Is there something we’re missing? Is t…