Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

253
Views
Prevent webpack from removing my exported function

Im trying to create a Razor Class Library which is exposing 1 js function. My problem is that webpack removes my exported function in final bundle file.

index.js

import * as myLib from "someLib"

export function connect(params) {
    // function logic omitted for clarity
}

And this is how I want to consume the js code

using MyComponent.Common;
using Microsoft.JSInterop;

namespace MyComponent.Services
{
    /// <inheritdoc />
    public class MyService : IMyService
    {
        private readonly Lazy<Task<IJSObjectReference>> _myWrapper;

        public MyService(IJSRuntime jsRuntime)
        {
            _myWrapper = new Lazy<Task<IJSObjectReference>>(() =>
                jsRuntime.InvokeAsync<IJSObjectReference>("import", "./_content/MyComponent/index.bundle.js")
                    .AsTask());
        }

        /// <inheritdoc />
        public async Task Connect(params)
        {
            if (_myWrapper is null)
            {
                throw new InvalidOperationException("Wrapper is not initialized");
            }

            IJSObjectReference module = await _myWrapper.Value;

            await module.InvokeVoidAsync("connect", params);
        }
    }
}

The exception I get is (as expected because there is no connect function exposed in index.bundle.js)

Could not find 'connect' ('connect' was undefined).
Error: Could not find 'connect' ('connect' was undefined).
    at https://localhost:7134/_framework/blazor.webassembly.js:1:328
    at Array.forEach (<anonymous>)
    at a.findFunction (https://localhost:7134/_framework/blazor.webassembly.js:1:296)
    at _ (https://localhost:7134/_framework/blazor.webassembly.js:1:2437)
    at https://localhost:7134/_framework/blazor.webassembly.js:1:3325
    at new Promise (<anonymous>)
    at Object.beginInvokeJSFromDotNet (https://localhost:7134/_framework/blazor.webassembly.js:1:3306)
    at Object.St [as invokeJSFromDotNet] (https://localhost:7134/_framework/blazor.webassembly.js:1:59849)
    at _mono_wasm_invoke_js_blazor (https://localhost:7134/_framework/dotnet.6.0.2-mauipre.1.22102.15.kf8l5pkaed.js:1:194973)
    at wasm://wasm/00970ba6:wasm-function[219]:0x1a129

about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

I just found a way to fix this. At the end of index.js I inserted the following line

window.connect = connect;

This makes webpack not to delete the connect function, however it's still not usable via IJSObjectReference because it expects the function to be exported like export function connect so I inserted another line at the end of final index.bundle.js

export function connect(params) { window.connect(params); }

I also had to disable auto webpack builds on my csproj file since my modifications would be lost after every build and that's it, I was able to use my function just fine after that.

about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!