Add PWA Support to template

pull/12179/head
enisn 4 years ago
parent c373edbac0
commit dad1f8505c

@ -48,6 +48,12 @@ public abstract class ProjectCreationCommandBase
Logger.LogInformation("Preview: yes");
}
var pwa = commandLineArgs.Options.ContainsKey(Options.ProgressiveWebApp.Short);
if (pwa)
{
Logger.LogInformation("Progressive Web App: yes");
}
var databaseProvider = GetDatabaseProvider(commandLineArgs);
if (databaseProvider != DatabaseProvider.NotSpecified)
{
@ -476,5 +482,10 @@ public abstract class ProjectCreationCommandBase
{
public const string Long = "preview";
}
public static class ProgressiveWebApp
{
public const string Short = "pwa";
}
}
}

@ -0,0 +1,21 @@
using System;
namespace Volo.Abp.Cli.ProjectBuilding.Building.Steps;
public class RemoveFileStep : ProjectBuildPipelineStep
{
private readonly string _filePath;
public RemoveFileStep(string filePath)
{
_filePath = filePath;
}
public override void Execute(ProjectBuildContext context)
{
var fileToRemove = context.Files.Find(x => x.Name.EndsWith(_filePath));
if (fileToRemove != null)
{
context.Files.Remove(fileToRemove);
}
}
}

@ -209,6 +209,15 @@ public abstract class AppTemplateBase : TemplateInfo
{
RemoveCmsKitDependenciesFromPackageJsonFiles(steps);
}
if (context.BuildArgs.ExtraProperties.ContainsKey(NewCommand.Options.ProgressiveWebApp.Short))
{
context.Symbols.Add("PWA");
}
else
{
RemovePwaFiles(steps);
}
}
protected static void RemoveCmsKitDependenciesFromPackageJsonFiles(List<ProjectBuildPipelineStep> steps)
@ -238,6 +247,15 @@ public abstract class AppTemplateBase : TemplateInfo
}
}
protected static void RemovePwaFiles(List<ProjectBuildPipelineStep> steps)
{
steps.Add(new RemoveFileStep("/aspnet-core/src/MyCompanyName.MyProjectName.Blazor/wwwroot/service-worker.js"));
steps.Add(new RemoveFileStep("/aspnet-core/src/MyCompanyName.MyProjectName.Blazor/wwwroot/service-worker.published.js"));
steps.Add(new RemoveFileStep("/aspnet-core/src/MyCompanyName.MyProjectName.Blazor/wwwroot/manifest.json"));
steps.Add(new RemoveFileStep("/aspnet-core/src/MyCompanyName.MyProjectName.Blazor/wwwroot/icon-192.png"));
steps.Add(new RemoveFileStep("/aspnet-core/src/MyCompanyName.MyProjectName.Blazor/wwwroot/icon-512.png"));
}
protected bool IsCmsKitSupportedForTargetVersion(ProjectBuildContext context)
{
if (string.IsNullOrWhiteSpace(context.BuildArgs.Version))

@ -29,4 +29,10 @@
<ProjectReference Include="..\..\src\MyCompanyName.MyProjectName.HttpApi.Client\MyCompanyName.MyProjectName.HttpApi.Client.csproj" />
</ItemGroup>
<!-- <TEMPLATE-REMOVE IF-NOT='PWA'> -->
<ItemGroup>
<ServiceWorker Include="wwwroot\service-worker.js" PublishedContent="wwwroot\service-worker.published.js" />
</ItemGroup>
<!-- </TEMPLATE-REMOVE> -->
</Project>

@ -0,0 +1,21 @@
{
"name": "MyProjectName",
"short_name": "MyCompanyName.MyProjectName",
"start_url": "./",
"display": "standalone",
"background_color": "#ffffff",
"theme_color": "#03173d",
"prefer_related_applications": false,
"icons": [
{
"src": "icon-512.png",
"type": "image/png",
"sizes": "512x512"
},
{
"src": "icon-192.png",
"type": "image/png",
"sizes": "192x192"
}
]
}

@ -0,0 +1,4 @@
// In development, always fetch from the network and do not enable offline support.
// This is because caching would make development more difficult (changes would not
// be reflected on the first load after each change).
self.addEventListener('fetch', () => { });

@ -0,0 +1,48 @@
// Caution! Be sure you understand the caveats before publishing an application with
// offline support. See https://aka.ms/blazor-offline-considerations
self.importScripts('./service-worker-assets.js');
self.addEventListener('install', event => event.waitUntil(onInstall(event)));
self.addEventListener('activate', event => event.waitUntil(onActivate(event)));
self.addEventListener('fetch', event => event.respondWith(onFetch(event)));
const cacheNamePrefix = 'offline-cache-';
const cacheName = `${cacheNamePrefix}${self.assetsManifest.version}`;
const offlineAssetsInclude = [ /\.dll$/, /\.pdb$/, /\.wasm/, /\.html/, /\.js$/, /\.json$/, /\.css$/, /\.woff$/, /\.png$/, /\.jpe?g$/, /\.gif$/, /\.ico$/, /\.blat$/, /\.dat$/ ];
const offlineAssetsExclude = [ /^service-worker\.js$/ ];
async function onInstall(event) {
console.info('Service worker: Install');
// Fetch and cache all matching items from the assets manifest
const assetsRequests = self.assetsManifest.assets
.filter(asset => offlineAssetsInclude.some(pattern => pattern.test(asset.url)))
.filter(asset => !offlineAssetsExclude.some(pattern => pattern.test(asset.url)))
.map(asset => new Request(asset.url, { integrity: asset.hash, cache: 'no-cache' }));
await caches.open(cacheName).then(cache => cache.addAll(assetsRequests));
}
async function onActivate(event) {
console.info('Service worker: Activate');
// Delete unused caches
const cacheKeys = await caches.keys();
await Promise.all(cacheKeys
.filter(key => key.startsWith(cacheNamePrefix) && key !== cacheName)
.map(key => caches.delete(key)));
}
async function onFetch(event) {
let cachedResponse = null;
if (event.request.method === 'GET') {
// For all navigation requests, try to serve index.html from cache
// If you need some URLs to be server-rendered, edit the following check to exclude those URLs
const shouldServeIndexHtml = event.request.mode === 'navigate';
const request = shouldServeIndexHtml ? 'index.html' : event.request;
const cache = await caches.open(cacheName);
cachedResponse = await cache.match(request);
}
return cachedResponse || fetch(event.request);
}
Loading…
Cancel
Save