Skip to content
This repository has been archived by the owner on Nov 6, 2023. It is now read-only.

Webpack - no source maps #119

Open
steamprodz opened this issue Jul 23, 2021 · 2 comments
Open

Webpack - no source maps #119

steamprodz opened this issue Jul 23, 2021 · 2 comments

Comments

@steamprodz
Copy link

steamprodz commented Jul 23, 2021

Hello,

I'm not very good with Webpacks and may do some mistakes in a description, but I think you will get a point.

I have a following issue:
When I use the middleware, my Vue.js app is built but the Webpack doesn't have source maps.

Original code:

axios.get(this.apiDashboardsUrl + "/Dashboards").then(response => {
      this.dashboardsData = response.data.result;
      this.loading = false;
  })
  .catch(error => {
      console.log(error);
  })

Result:

axios__WEBPACK_IMPORTED_MODULE_9___default.a.get(this.apiDashboardsUrl + "/Dashboards").then(function (response) {
  _this2.dashboardsData = response.data.result;
  _this2.loading = false;
}).catch(function (error) {
  console.log(error);
});

Message in console:
DevTools failed to load source map: Could not load content for https://localhost:44303/vue/js/app.js.map: Load canceled due to load timeout

Possibly I am making a bad configuration?
My code setup is following:

public void ConfigureServices(IServiceCollection services)
{
    // ...
    services.AddSpaStaticFiles(configuration =>
    {
        configuration.RootPath = "wwwroot/vue";
    });
}
public void Configure(IApplicationBuilder app, IWebHostEnvironment env, ILoggerFactory loggerFactory)
{
    // ...
    app.UseSpaStaticFiles();
    // ...
    app.UseEndpoints(endpoints =>
            {
                endpoints.MapDefaultControllerRoute();

                endpoints.MapToVueCliProxy(
                    "{*path}",
                    new SpaOptions { SourcePath = "client-app" },
                    npmScript: (System.Diagnostics.Debugger.IsAttached) ? "watch" : null,
                    regex: "Compiled successfully",
                    forceKill: true
                    );
            });
}

So, I have vue.js files in client-app folder but export it to wwwroot/vue folder.
The reason is I want to mix up Razor pages and Vue.js pages.

P.S. When I run npm run build command in terminal in VSCode and start my .NET Core App, the sourcemaps are there and code is not compiled.

Not sure what might be wrong here.

@steamprodz
Copy link
Author

Seems like I found a solution:

In vue.config.js I added this line:

configureWebpack: {
    devtool: 'source-map',
   // ...
}

Now source maps are here. However, I still don't know what was exactly wrong before, since when I built my app via VSCode terminal, the sourcemaps were produced.

@steamprodz steamprodz changed the title Webpack source code is already compiled (no source maps) Webpack - no source maps Jul 23, 2021
@steamprodz
Copy link
Author

This actually didn't work, after a while for some reason all code became a .js compiled code again.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant