reactjs - 在 Chrome 问题中通过 React 代码进行单步调试

问题描述

我看了几个教程并在询问之前进行了研究，但在任何地方都找不到答案。当谷歌搜索“React Debugging”时，大多数人会使用“Sources”选项卡显示 Chrome devtools，该选项卡具有“bundle.js”文件和“webpack”分支，其中包含可用于将断点放入进一步调试应用程序的所有源。但就我而言，这些都不存在。

事实上，当我运行我的应用程序时，我看到的唯一文件如下所示：

“main.bla-bla.js”有点像包含所有代码的捆绑包，但 webpack:// 下没有任何 .js 文件！？

如果重要的话，在 Visual Studio 中开发我的 React 应用程序。

从 startup.cs 中配置函数：

 public void Configure(IApplicationBuilder app, IHostingEnvironment env)
        {
            if (env.IsDevelopment())
            {
                app.UseDeveloperExceptionPage();
            }
            else
            {
                app.UseExceptionHandler("/Error");
                app.UseHsts();
            }

            app.UseHttpsRedirection();
            app.UseStaticFiles();
            app.UseSpaStaticFiles();

            app.UseMvc(routes =>
            {
                routes.MapRoute(
                    name: "default",
                    template: "{controller}/{action=Index}/{id?}");
            });

            app.UseSpa(spa =>
            {
                spa.Options.SourcePath = "ClientApp";

                if (env.IsDevelopment())
                {
                    spa.UseReactDevelopmentServer(npmScript: "start");
                }
            });
        }

标签： reactjs

reactjs - 在 Chrome 问题中通过 React 代码进行单步调试

问题描述

解决方案

推荐阅读