ASP.NET Core 2.1 simple + lite (npm-free) Vue SPA using TypeScript with integrated bundling + hot reloading
Browse source code and view live demo vue-lite.web-templates.io
Install with x
.NET Core tool:
$ dotnet tool install -g x
$ x new vue-lite-corefx ProjectName
This template goal is to provide the richest suite of functionality with the least amount of complexity. TypeScript was adopted because it runs as a non-invasive global tool with no dependencies that enables us to use the latest JavaScript language features to be able to develop with the same source code as a fully-fledged npm webpack build system should you wish to upgrade to one in future.
All that's needed during development is to run TypeScript in "watch" mode:
$ tsc -w
Which monitors any changes to any .ts
files and incrementally compiles their .js
files on save. ServiceStack's built-in
static files hot-reloading detects
changes to any .js
files to automatically reload the page, whilst the built-in dynamic .html page
monitors for changes to any of its dependent resources.
In a new Terminal window start your .NET Web App HTTP Server with:
$ dotnet watch run
Using watch run
will monitor changes to C#
source files where it will automatically re-build and restart the Server.
After changing your ServiceStack Services, you can re-generate their Typed TypeScript DTOs with:
$ x ts
The integrated .js
and .css
bundling is configured to use an fast unminified in-memory bundle for optimal development experience whilst
it utilizes a cached in-memory minified bundle created on first request in production releases.
Optionally the same bundling configuration can be used in _bundle.ss to generate and save a more advanced optimized bundle using NUglify with:
$ x run wwwroot\_bundle.ss
The standard .NET Core tools can be used to publish:
$ dotnet publish -c Release
Then deploy as normal, e.g. via rsync deployments to Linux or to an AWS EC2 container using Docker.