Using NPM packages without Webpack

Question

I am used to using NPM packages with Webpack, but I'm wondering how you're supposed to use NPM packages without Webpack. I know how to install packages. I just don't know how to use them, since you can't just import modules in plain js.

Answer 1

I am used to using NPM packages with Webpack, but I'm wondering how you're supposed to use NPM packages without Webpack. I know how to install packages. I just don't know how to use them, since you can't just import modules in plain js.

Answer 2

I am used to using NPM packages with Webpack, but I'm wondering how you're supposed to use NPM packages without Webpack. I know how to install packages. I just don't know how to use them, since you can't just import modules in plain js.

Answer 3

For front-end, not node.js but still NPM modules.

HTML can import directly ES6 modules but the file must be in .mjs format and provide export default , Module.exports in regular .js file wont't work. This is not a common thing and you'll run into problems if there are subdependencies that don't use ES6 modules. If you find a module that supports it. ie some-module

npm install some-module

And in the same directory next to node_modules create index.html pointing straight to the modular bundle

<h1>I'm HTML</h1>
<script type="module">
  import SomeModule from './node_modules/some-module/bundle.mjs';
  const mod = new SomeModule();
  mod.doStuff();
</script>

Here's an article about this https://medium.com/passpill-project/files-with-mjs-extension-for-javascript-modules-ced195d7c84a

Answer 4

I am used to using NPM packages with Webpack, but I'm wondering how you're supposed to use NPM packages without Webpack. I know how to install packages. I just don't know how to use them, since you can't just import modules in plain js.