Include interop Script at _content/Blazor.Extensions.Storage/Storage.js

README.md

@@ -15,6 +15,12 @@ This package wraps [HTML5 Storage](https://developer.mozilla.org/en-US/docs/Web/
 
 ## Setup
 
+Include the following snippet in the the ```head``` section of the Index page (```wwwroot/index.html```).
+
+```html
+<script src="_content/Blazor.Extensions.Storage/Storage.js"></script>
+```
+
 The following snippet shows how to setup the storage wrapper by registering it for dependency injection in the ```Startup.cs``` of the application.
 
 ```c#

Storage.sln

@@ -1,7 +1,7 @@
 
 Microsoft Visual Studio Solution File, Format Version 12.00
-# Visual Studio 15
-VisualStudioVersion = 15.0.26124.0
+# Visual Studio Version 16
+VisualStudioVersion = 16.0.29806.167
 MinimumVisualStudioVersion = 15.0.26124.0
 Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = "src", "src", "{B286BCBD-DAD8-4DE7-9334-3DE18DF233AF}"
 EndProject
@@ -16,8 +16,6 @@ Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = "Solution Items", "Solution
 EndProject
 Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "Blazor.Extensions.Storage.Test", "test\Blazor.Extensions.Storage.Test\Blazor.Extensions.Storage.Test.csproj", "{C4BB6A39-28E6-454D-8679-92562CEAD0A9}"
 EndProject
-Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "Blazor.Extensions.Storage.JS", "src\Blazor.Extensions.Storage.JS\Blazor.Extensions.Storage.JS.csproj", "{1C49147F-7C73-4962-A71C-6A193970D058}"
-EndProject
 Global
 	GlobalSection(SolutionConfigurationPlatforms) = preSolution
 		Debug|Any CPU = Debug|Any CPU
@@ -52,26 +50,13 @@ Global
 		{C4BB6A39-28E6-454D-8679-92562CEAD0A9}.Release|x64.Build.0 = Release|Any CPU
 		{C4BB6A39-28E6-454D-8679-92562CEAD0A9}.Release|x86.ActiveCfg = Release|Any CPU
 		{C4BB6A39-28E6-454D-8679-92562CEAD0A9}.Release|x86.Build.0 = Release|Any CPU
-		{1C49147F-7C73-4962-A71C-6A193970D058}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
-		{1C49147F-7C73-4962-A71C-6A193970D058}.Debug|Any CPU.Build.0 = Debug|Any CPU
-		{1C49147F-7C73-4962-A71C-6A193970D058}.Debug|x64.ActiveCfg = Debug|Any CPU
-		{1C49147F-7C73-4962-A71C-6A193970D058}.Debug|x64.Build.0 = Debug|Any CPU
-		{1C49147F-7C73-4962-A71C-6A193970D058}.Debug|x86.ActiveCfg = Debug|Any CPU
-		{1C49147F-7C73-4962-A71C-6A193970D058}.Debug|x86.Build.0 = Debug|Any CPU
-		{1C49147F-7C73-4962-A71C-6A193970D058}.Release|Any CPU.ActiveCfg = Release|Any CPU
-		{1C49147F-7C73-4962-A71C-6A193970D058}.Release|Any CPU.Build.0 = Release|Any CPU
-		{1C49147F-7C73-4962-A71C-6A193970D058}.Release|x64.ActiveCfg = Release|Any CPU
-		{1C49147F-7C73-4962-A71C-6A193970D058}.Release|x64.Build.0 = Release|Any CPU
-		{1C49147F-7C73-4962-A71C-6A193970D058}.Release|x86.ActiveCfg = Release|Any CPU
-		{1C49147F-7C73-4962-A71C-6A193970D058}.Release|x86.Build.0 = Release|Any CPU
 	EndGlobalSection
 	GlobalSection(SolutionProperties) = preSolution
 		HideSolutionNode = FALSE
 	EndGlobalSection
 	GlobalSection(NestedProjects) = preSolution
 		{9378C7BF-0899-4835-B8FB-099292C8C63D} = {B286BCBD-DAD8-4DE7-9334-3DE18DF233AF}
 		{C4BB6A39-28E6-454D-8679-92562CEAD0A9} = {20DAA632-F8AD-4C5F-9E5F-FC82B7CB56A7}
-		{1C49147F-7C73-4962-A71C-6A193970D058} = {B286BCBD-DAD8-4DE7-9334-3DE18DF233AF}
 	EndGlobalSection
 	GlobalSection(ExtensibilityGlobals) = postSolution
 		SolutionGuid = {A97C0A4B-E309-4485-BB76-898B37BFBFFF}

src/Blazor.Extensions.Storage/Blazor.Extensions.Storage.csproj

@@ -1,4 +1,4 @@
-<Project Sdk="Microsoft.NET.Sdk.Web">
+<Project Sdk="Microsoft.NET.Sdk.Razor">
 
   <PropertyGroup>
     <Title>Blazor Extensions Storage</Title>
@@ -12,20 +12,78 @@
     <LangVersion>7.3</LangVersion>
     <RazorLangVersion>3.0</RazorLangVersion>
     <AddRazorSupportForMvc>true</AddRazorSupportForMvc>
-    <TargetsForTfmSpecificBuildOutput>$(TargetsForTfmSpecificBuildOutput);IncludeP2POutput</TargetsForTfmSpecificBuildOutput>
+    <InteropWorkingDir>$(MSBuildThisFileDirectory)Interop\</InteropWorkingDir>
+    <ResolveCurrentProjectStaticWebAssetsInputsDependsOn>
+      CompileInterop;
+      $(ResolveCurrentProjectStaticWebAssetsInputsDependsOn)
+    </ResolveCurrentProjectStaticWebAssetsInputsDependsOn>
+    <DefaultItemExcludes>$(DefaultItemExcludes);$(InteropWorkingDir)node_modules\**</DefaultItemExcludes>
+    <Version>1.1.0-dev</Version>
   </PropertyGroup>
 
   <ItemGroup>
     <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="3.1.0-preview3.19555.2" />
   </ItemGroup>
 
+  <Target Name="DebugEnsureNodeEnv" BeforeTargets="Build" Condition=" '$(Configuration)' == 'Debug' And !Exists('$(InteropWorkingDir)node_modules') ">
+    <!-- Ensure Node.js is installed -->
+    <Exec Command="node --version" ContinueOnError="true">
+      <Output TaskParameter="ExitCode" PropertyName="ErrorCode" />
+    </Exec>
+    <Error Condition="'$(ErrorCode)' != '0'" Text="Node.js is required to build and run this project. To continue, please install Node.js from https://nodejs.org/, and then restart your command prompt or IDE." />
+    <Message Importance="high" Text="Restoring dependencies using 'npm'. This may take several minutes..." />
+    <Exec WorkingDirectory="$(InteropWorkingDir)" Command="npm install" />
+  </Target>
+
   <ItemGroup>
-    <ProjectReference Include="..\Blazor.Extensions.Storage.JS\Blazor.Extensions.Storage.JS.csproj" PrivateAssets="All" />
+    <InteropInputs Include="$(InteropWorkingDir)**" Exclude="$(InteropWorkingDir)node_modules\**;$(InteropWorkingDir)*.d.ts;$(InteropWorkingDir)dist\**" />
+    <InteropOutputs Include="$(InteropWorkingDir)dist\Storage.js" />
+
+    <Content Remove="$(InteropWorkingDir)**" />
+    <None Include="$(InteropWorkingDir)*" Exclude="$(InteropWorkingDir)node_modules\**" />
+
+    <UpToDateCheckInput Include="@(InteropInputs)" Set="StaticWebassets" />
+    <UpToDateCheckOutput Include="@(InteropOutputs)" Set="StaticWebassets" />
   </ItemGroup>
 
-  <Target Name="IncludeP2POutput">
+  <Target Name="_CreateInteropHash" BeforeTargets="CompileInterop" Condition="'$(DesignTimeBuild)' != 'true'">
+
+    <PropertyGroup>
+      <InteropCompilationCacheFile>$(IntermediateOutputPath)interop.cache</InteropCompilationCacheFile>
+    </PropertyGroup>
+
+    <Hash ItemsToHash="@(InteropInputs)">
+      <Output TaskParameter="HashResult" PropertyName="_InteropInputsHash" />
+    </Hash>
+
+    <WriteLinesToFile Lines="$(_InteropInputsHash)" File="$(InteropCompilationCacheFile)" Overwrite="True" WriteOnlyWhenDifferent="True" />
+
     <ItemGroup>
-      <BuildOutputInPackage Include="$(OutputPath)Blazor.Extensions.Storage.JS.dll" />
+      <FileWrites Include="$(InteropCompilationCacheFile)" />
     </ItemGroup>
+
+  </Target>
+
+  <Target Name="CompileInterop" Condition="'$(DesignTimeBuild)' != 'true'" Inputs="$(InteropCompilationCacheFile)" Outputs="@(InteropOutputs)">
+
+    <Exec WorkingDirectory="$(InteropWorkingDir)" Command="npm install" />
+    <Exec WorkingDirectory="$(InteropWorkingDir)" Command="npm run build" />
+
+    <ItemGroup>
+      <_InteropBuildOutput Include="$(InteropWorkingDir)dist\**" />
+
+      <StaticWebAsset Include="@(_InteropBuildOutput->'%(FullPath)')">
+        <SourceType></SourceType>
+        <SourceId>$(PackageId)</SourceId>
+        <ContentRoot>$([MSBuild]::NormalizeDirectory('$(InteropWorkingDir)\dist'))</ContentRoot>
+        <BasePath>_content/$(PackageId)</BasePath>
+        <RelativePath>$([System.String]::Copy('%(RecursiveDir)%(FileName)%(Extension)').Replace('\','/'))</RelativePath>
+      </StaticWebAsset>
+
+      <FileWrites Include="$(_InteropBuildOutput)" />
+    </ItemGroup>
+
+    <Message Importance="high" Text="@(_InteropBuildOutput->'Emitted %(FullPath)')" />
+
   </Target>
 </Project>

src/Blazor.Extensions.Storage.JS/webpack.config.js → src/Blazor.Extensions.Storage/Interop/webpack.config.js

@@ -16,7 +16,7 @@ module.exports = {
     ]
   },
   entry: {
-    "blazor.extensions.storage": "./src/InitializeStorage.ts"
+    "Storage": "./src/InitializeStorage.ts"
   },
   output: {
     path: path.join(__dirname, "/dist"),

test/Blazor.Extensions.Storage.Test/Blazor.Extensions.Storage.Test.csproj

@@ -14,7 +14,6 @@
   </ItemGroup>
 
   <ItemGroup>
-    <ProjectReference Include="..\..\src\Blazor.Extensions.Storage.JS\Blazor.Extensions.Storage.JS.csproj" />
     <ProjectReference Include="..\..\src\Blazor.Extensions.Storage\Blazor.Extensions.Storage.csproj" />
   </ItemGroup>
 

test/Blazor.Extensions.Storage.Test/wwwroot/index.html

@@ -10,6 +10,7 @@
   <app>Loading...</app>
 
   <script src="_framework/blazor.webassembly.js"></script>
+  <script src="_content/Blazor.Extensions.Storage/Storage.js"></script>
   <script type="text/javascript">
 
     function getLocalStorage(key) {