Question 335400 in Javascript Question posted in
A very good W3school tutorial can be found here.

Javascript – How to include JS from node_modules in Vite in production?

I have a svelte project that uses Vite for its build tooling. I want to import a js file from the sakura-js package and call it in my index.html file. It works locally when I use the script tag like this:

    <script src="/node_modules/sakura-js/dist/sakura.min.js"></script>

But in prod, it gives a 404 error trying the script. How do I import the script so it works in prod?

Tags:

2

Answers


  1. 0

    You need to use a JavaScript file from the sakura-js package in production.

    In your main script file (e.g., main.js or App.svelte), you can import the library like so:

    import 'sakura-js/dist/sakura.min.js';

<script src="/sakura.min.js"></script>
    Login or Signup to reply.
  2. 0

    import ‘sakura-js/dist/sakura.min.js’;

    document.addEventListener('DOMContentLoaded', function () {
    // Assuming Sakura is accessible globally and an element with id 'sakura-area' exists
    new window.Sakura('#sakura-area');
});

<script>
  import { onMount } from 'svelte';
  import 'sakura-js/dist/sakura.min.js';

  onMount(() => {
    // Ensure Sakura is available globally, then instantiate it targeting a specific element
    new window.Sakura('#sakura-area');
  });
</script>

<div id="sakura-area">
  <!-- The area where the Sakura effect will be applied -->
</div>
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search