Tag Archives: dotnet tips and tricks

ASP.Net Core Enable Development Error

由於不太了解 ASP.Net Core with Angular / React Webpack 的關係
當遇到有 Angular / React的問題是都不知道那裡出錯
* 我的Angular / ReactJs Project是用 dotnet core 的 SPA template 建立的

過了幾天才發現..
由於是使用

dotnet run

dotnet watch run

的關係
所以執行的 port 和visual studio執行時debug 的port不一樣..
可能是這樣所以被定義為不是 development mode
所以網頁的error 便被隱藏了

解決方法有兩個

解決方法 1
我們可以在Startup.cs
Enable Developer Error 便可以了
E.G.
在以下的function 上

  public void Configure(IApplicationBuilder app, IHostingEnvironment env, ILoggerFactory loggerFactory)
      

移除這個If statement
當程式遇到錯誤時執行這個Developer Error

/*
if (env.IsDevelopment())
            {
                app.UseDeveloperExceptionPage();
                app.UseWebpackDevMiddleware(new WebpackDevMiddlewareOptions {
                    HotModuleReplacement = true
                });
            }
            else
            {
                app.UseExceptionHandler("/Home/Error");
            }
*/

 app.UseDeveloperExceptionPage();
                app.UseWebpackDevMiddleware(new WebpackDevMiddlewareOptions {
                    HotModuleReplacement = true
                });

 startup.cs
解決方法 2

這個方法比理性
就是更改 開發電腦的 Environment Variable Settings
我們可以使用Command prompt
執行以下指令設定環境變數 Environment Variable

set ASPNETCORE_ENVIRONMENT=Development

Set up ASPNETCORE Environment Variable
詳情可以參考以下網頁
https://docs.microsoft.com/en-us/aspnet/core/fundamentals/environments

Hope you find it useful

dotnet watch does not refresh content for AspNetCore.SpaTemplates React / Angular

最近使用了 ASP.Net CoreSPA Template 來學習 ReactJs
因為我可以使用 ASP.Net Core 來做 Web API.. 而 ReactJs 來做 Web Front End
之後便可以deploy到 Azure 十分方便.. 又可以很快看到效果
ASP.Net Core App can NOW be deploy to Azure – (Azure web app)

由于使用Visual Studio 開發感覺比效慢
所以便用了Visual Studio Code

不久便出現了一個問題..就是在Visual Studio 開發時
修改 ReactJs 相關的程式碼..在Debug
是可以看到修改後的結果的
但是用Visual Studio Code 配合 “dotnet watch run” 時
Enable dotnet watch – on asp.net core

dotnet watch run

dotnet watch run
網頁便不會更新… 但是deployAzure 時是看到了修改的結果的

做了一會research之後 終於找到了解決方法

解決方法
我們需要使用另一個Terminal windows 執行 “webpack –watch” 這個指令 便可以了

webpack --watch

webpack --watch
Hope you find it useful

Enable dotnet watch – on asp.net core

最近開始學習 .Net CoreASP.Net Core
發現現在.net 越來越方便了
之前開發 asp.net 的 web application 時每當要更改程式碼 時
都有需要停止 debug之後更重新開始debug..
感覺開發.net application 需要的時間比較長
不像使用 node.js一樣..可以使用 gulpgrunt 來檢查程式碼有沒有更新
如果有的話便會re-compile 等等
之後只要refresh browser便會自看到程式碼所做的更新

現在.net core 也有這個功能叫 “dotnet watch
我們只需要在”.csproj” 上的 “<ItemGroup>” tag 內加上以下的 setting
e.g.

  &lt;ItemGroup&gt;
    &lt;DotNetCliToolReference Include="Microsoft.DotNet.Watcher.Tools" Version="1.0.0" /&gt;
    &lt;DotNetCliToolReference Include="Microsoft.Extensions.SecretManager.Tools" Version="1.0.0" /&gt;
    &lt;DotNetCliToolReference Include="Microsoft.Extensions.Caching.SqlConfig.Tools" Version="1.0.0" /&gt;
  &lt;/ItemGroup&gt;

之後在這個project 的資料夾的 執行

dotnet restore

之後便可以 在 CLI上執行

dotnet watch run

hope you find it useful