Call webpack-ed function from JS file

83
July 23, 2022, at 08:40 AM

I'm facing an issue, the goal I want to achieve is call a function from a webpack file.

I've followed this question and I can do it in the same way as the accepted answer. Using the tag <script> in the HTML and window.onload. But I want to call my function from a.js file.

So I want something like this:

  1. The HTML calls a JS script file.
  2. JS script import function from webpack-ed JS.
  3. webpacked function is executed.

The tree folder is like this:

|
|-> index.html
|-> index.js       --> From here I want to call function packed
|-> lib
     |
     |-> main.js   --> webpacked file

My webpack.config.js is

module.exports = {
  // ...
  output: {
    filename: 'main.js',
    path: path.resolve(__dirname, 'lib'),
    libraryTarget: 'var',
    library: 'MyLibrary'
  },
};

The file I'm packing is a TS file which has a function like this:

export function test(){
    console.log("test")
}

Then in the HTML I call the JS file:

<script type="module" src="./index.js"></script>

And into index.js I do the import:

import MyLibrary from './lib/main.js';
// here I want to do MyLibrary.test()

But it throws an error:

Uncaught SyntaxError: import not found: default

Also I've tried:

import {test} from './lib/main.js';

Or adding default in the TS file.

export default function test(){
    console.log("test")
}
// or
function test() { ... }
export {test as default};

But, as I've said before, adding this into the HTML works:

<script src="./lib/main.js"></script>
<script>
window.onload = function () {
    MyLibrary.test();
};
</script>

But I want to have the function in a JS file.

I've found a similar question but the answer don't work for me.

Thanks in advance

Rent Charter Buses Company
READ ALSO
how do you create a folder and write to heroku&#39;s ephemeral storage?

how do you create a folder and write to heroku's ephemeral storage?

i'm using nodejs, and when my script uses fsmkdir nothing seems to happen

54
Is there an additional server configuration for api redirection using nodejs?

Is there an additional server configuration for api redirection using nodejs?

Im currently developing a website for out company that requires connection between two servers via APIThe problem is, on our laptop it redirection works fine but when I deploy it on our test server, it uses its own URL instead of the one we set on the nodejs...

95
How to delete messages EFFICIENTLY with Discord bot

How to delete messages EFFICIENTLY with Discord bot

I want have a Discord Music Bot that when it leaves the voice channel it clears the text channel from commands and logsBut the problem is that it takes too much time (up to 1-3 mins)

124
get npm process exitcode as output in powershell

get npm process exitcode as output in powershell

I'm new to Powershell and want to automate some process by Powershell scriptIs there any way to get the status of npm run build, if it fails

64