Question 44869 in Html Question posted in
Some basic documentation can be found here.

import npm packages to bare javascript html

Trying to import an npm package to bare JS/HTML served with python/flask.

<script type="module">

    import { configureChains, createClient } from "./node_modules/@wagmi/core";
    import { bsc } from "./node_modules/@wagmi/core/chains";
    import { Web3Modal } from "./node_modules/@web3modal/html";
    import {EthereumClient,modalConnectors,walletConnectProvider} from "./node_modules/@web3modal/ethereum";


</script>

Error message:

Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "text/html". Strict MIME type checking is enforced for module scripts per HTML spec.

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    I solved the problem with using dist/main.js that webpack created. If you face with this problem you can use webpack easily.


  2. 0

    When you import or require a module in Node.js it has a bunch of rules for converting a module name to a module (including picking particular files out of module directories).

    Browsers don’t do that. When you import a module you need to provide a URL that points to the JS file containing the module.

    Your URL points to an HTML document. Probably this is an automatically generated HTML document containing a listing of the files in that directory.

    You need to change it to point to the JS file.

    Aside:

    The JS file will also need to be an ES6 module (not a CommonJS module) and not depend on any Node.js-specific APIs (such as the fs module).

    Note: Generally people using npm to manage client-side dependencies will use a bundler tool (such as Webpack or Parcel) to convert their modules into a single browser-compatible file. Such tools can take care of the different kinds of module supported by Node.js (although they can’t make things like filesystem access work!).

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search