-
Notifications
You must be signed in to change notification settings - Fork 2
/
BrowserReload.cshtml
46 lines (37 loc) · 2.26 KB
/
BrowserReload.cshtml
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
@{
ViewData["Title"] = "Rollup Code Splitting";
}
<h2>Demonstrates automatic browser reload..</h2>
<p>NetPack browser reload can be configured to watch for file changes under wwwroot (web root files) as well as content file changes (such as the Views/**/*.cshtml files) and trigger a browser reload for you.</p>
<p>In startup.cs simply configure it as desired:</p>
<code><pre>
services.AddBrowserReload((options) =>
{
// trigger browser reload when our bundle file changes.
options.WatchWebRoot("/netpack/built.js");
options.WatchContentRoot("/Views/**/*.cshtml");
});
</pre>
</code>
<p>Lastly, include the browser refresh client on your page or layout.cshtml</p>
<code>
<pre>
<script src="~/lib/signalr/dist/browser/signalr.js"></script>
<script src="~/embedded/netpack/js/reload.js"></script>
</pre>
</code>
<p><strong>Note: the ~/embedded/netpack/js/reload.js file is automatically served as an embedded resource from the Netpack.BrowserReload assembly - you do not have to add this script yourself to your project. However the signalr script you do have to source yourself, use signalr documentation for guidance on obtaining it and adding it to your project.</strong></p>
<p>
In the example above we want to trigger a reload if our javascript bundle file is changed. We have configured a NetPack pipeline to build this bundle for us from the input files under `/wwwroot/amd/*.js`.
Therefore to trigger a browser reload, change a file under `/wwwroot/amd/` folder. This will cause netpack to rebuild the bundle file `/netpack/built.js`, which will then trigger a browser reload!
BrowserReload is also configured in startup.cs to watch for changes on content files under: `Views/**/*.cshtml` so you can also make a change to any of those razor views to trigger a browser refresh.
</p>
<h1>Browser Reload Demo</h1>
<ul id="modules"></ul>
@section scripts
{
<script src="~/lib/signalr/dist/browser/signalr.js"></script>
<script src="~/embedded/netpack/js/reload.js"></script> @*This is embedded, you don't have to source it yourself*@
<script src="~/lib/require.js/require.min.js"></script>
<script src="~/netpack/built.js" asp-append-version="true"></script>
}