为 ASP.NET Core 6 MVC 项目创建包含静态 CSS 和 JS 文件的 NuGet 包

问题描述 投票：0回答：1

我需要一些帮助来从 ASP.NET Core 6 MVC 项目创建我的 NuGet 包。我创建了一个 MVC 项目，因为我想共享 CSS、JS 和 _Layout 文件。在另一个 MVC 项目中安装包后，我需要 NuGet 复制（或替换）此文件以保持结构。

为了进行测试，我使用 GitHub Packages 来分发 NuGet 包。

我尝试了一些方法（例如this和this、ChatGPT、Codeium Chat和Bing），但没有成功，所以，我的项目有一些不必要的文件和配置（我知道）。

项目结构

ACMELayoutWeb
  |-- build
  |     |-- ACMELayoutWeb.props
  |     |-- ACMELayoutWeb.targets
  |-- wwwroot    <- This folder
  |     |-- cldr-data
  |     |-- css
  |     |    |-- devextreme
  |     |-- js
  |     |    |-- devextreme
  |     |-- acme
  |     |    |-- css
  |     |    |    |-- css, min.css, scss
  |     |    |-- js
  |-- nuget.config  <- ignore this file
  |-- ACMELayoutWeb.nuspec
  |-- ACMELayoutWeb.props
  |-- ACMELayoutWeb.targets
  |-- Views
  |     |-- Shared
  |     |    |-- _Layout.cshtml  <- This file
  |     |    |-- ErrorPage.cshtml  <- This file will be created soon and need to be copied

我的

.csproj
文件：

<Project Sdk="Microsoft.NET.Sdk.Web">
  <PropertyGroup>
    <TargetFramework>net6.0</TargetFramework>
    <Nullable>enable</Nullable>
    <ImplicitUsings>enable</ImplicitUsings>
    <AspNetCoreHostingModel>OutOfProcess</AspNetCoreHostingModel>
    <Authors>ACME</Authors>
    <GeneratePackageOnBuild>True</GeneratePackageOnBuild>
    <PackageProjectUrl>https://github.com/MY_USER/ACMELayoutWeb</PackageProjectUrl>
    <RepositoryUrl>https://github.com/MY_USER/ACMELayoutWeb</RepositoryUrl>
    <Title>Layout Sistemas Web ACME</Title>
    <Description>Layout para os sistemas web ACME</Description>
    <IsPackable>true</IsPackable>
  </PropertyGroup>
  <ItemGroup>
    <None Remove="build\ACMELayoutWeb.targets" />
  </ItemGroup>
  <ItemGroup>
    <PackageReference Include="DevExtreme.AspNet.Core" Version="22.2.4" />
    <PackageReference Include="DevExtreme.AspNet.Data" Version="2.9.0" />
  </ItemGroup>
  <ItemGroup>
    <Folder Include="Views\" />
    <Folder Include="wwwroot\" />
  </ItemGroup>
  <ItemGroup>
    <Content Update="wwwroot\**\*">
      <CopyToPublishDirectory>Always</CopyToPublishDirectory>
      <CopyToOutputDirectory>Always</CopyToOutputDirectory>
    </Content>
  </ItemGroup>
  <ItemGroup>
    <Content Update="compilerconfig.json">
      <CopyToOutputDirectory>Never</CopyToOutputDirectory>
    </Content>
    <Content Update="wwwroot\pmlp\js\pmlp.js">
      <CopyToOutputDirectory>Always</CopyToOutputDirectory>
    </Content>
  </ItemGroup>
  <ItemGroup>
    <None Include="wwwroot\css\devextreme\**" Pack="true" PackagePath="content\wwwroot\css\devextreme" />
    <None Include="wwwroot\js\devextreme\**" Pack="true" PackagePath="content\wwwroot\js\devextreme" />
    <None Include="wwwroot\pmlp\css\**" Pack="true" PackagePath="content\wwwroot\pmlp\css">
      <PackageCopyToOutput>true</PackageCopyToOutput>
    </None>
    <None Include="wwwroot\pmlp\js\**" Pack="true" PackagePath="content\wwwroot\pmlp\js" >
      <PackageCopyToOutput>true</PackageCopyToOutput>
    </None>
    <None Include="wwwroot\cldr-data\**" Pack="true" PackagePath="content\wwwroot\cldr-data">
      <PackageCopyToOutput>true</PackageCopyToOutput>
    </None>
    <Content Remove="nuget.config" />
    <None Include="nuget.config">
      <CopyToOutputDirectory>Never</CopyToOutputDirectory>
    </None>
    <Content Remove="compilerconfig.json" />
    <None Include="compilerconfig.json">
      <CopyToOutputDirectory>Never</CopyToOutputDirectory>
    </None>
    <None Include="Views\Shared\_Layout.cshtml" Pack="true" PackagePath="content\Views\Shared" />
    
    <None Include="ACMELayoutWeb.props" Pack="true" PackagePath="build\"></None>
    <None Include="ACMELayoutWeb.props" Pack="true" PackagePath="buildMultiTargeting\"></None>
    <None Include="ACMELayoutWeb.targets" Pack="true" PackagePath="build\"></None>
    <None Include="ACMELayoutWeb.targets" Pack="true" PackagePath="buildMultiTargeting\"></None>
    
    <None Include="build/*" Pack="true" PackagePath="build"></None>
    <None Include="build/*" Pack="true" PackagePath="buildMultiTargeting"></None>
    <None Include="build\ACMELayoutWeb.props" Pack="true" PackagePath="build/$(TargetFramework)"/>
  </ItemGroup>
</Project>


.nuspec
文件：

<?xml version="1.0"?>
<package xmlns="http://schemas.microsoft.com/packaging/2010/07/nuspec.xsd">
  <metadata>
    <id>ACMELayoutWeb</id>
    <version>1.0.0</version>
    <authors>ACME</authors>
    <owners>ACME</owners>
    <requireLicenseAcceptance>false</requireLicenseAcceptance>
    <description>Descrição do projeto</description>
    <releaseNotes>Notas de lançamento</releaseNotes>
    <tags>Tags do projeto</tags>
    <dependencies>
      <dependency id="DevExtreme.AspNet.Core" version="22.2.4" />
      <dependency id="DevExtreme.AspNet.Data" version="2.9.0" />
    </dependencies>
  </metadata>
  <files>
    <!--
    <file src="ACMELayoutWeb.targets" target="build" />
    <file src="wwwroot/css/devextreme/*.css" target="content/wwwroot/css/devextreme" />
    <file src="wwwroot/js/devextreme*.js" target="content/wwwroot/js/devextreme" />
    <file src="wwwroot/acme/js/acme.js" target="content/wwwroot/acme/js" />
    <file src="wwwroot/acme/css/acme.min.css" target="content/wwwroot/acme/css" />
    <file src="wwwroot/acme/css/bootstrap.min.css" target="content/wwwroot/acme/css" />
    <file src="wwwroot/cldr-data/*.*" target="content/wwwroot" />
    <file src="Views/Shared/_Layout.cshtml" target="content/Views/Shared" />
    -->
    
    <!--<file src="ACMELayoutWeb.props" target="build"/>
    <file src="ACMELayoutWeb.targets" target="build"/>
    <file src="wwwroot/acme/css/*" target="content/wwwroot/acme/css" exclude="**\*.scss"/>
    <file src="wwwroot/acme/js/*" target="content/wwwroot/acme/js" />-->
    
    <file src="Views/Shared/_Layout.cshtml" target="content/Views/Shared" />
    <file src="nuget.config" target="content"/>
    <file src="compilerconfig.json" target="content"/>
    <file src="appsettings.json" target="content"/>



    <!--<file src="build\ACMELayoutWeb.props" target="build" />-->
    <file src="build\**" target="build" />
    <!--<file src="wwwroot\**" target="resource\wwwroot" />-->
    <file src="wwwroot\acme\css\**\*.*" target="resource\wwwroot\acme\css" />
    <file src="wwwroot\acme\js\**\*.*" target="resource\wwwroot\acme\js" />
    <file src="wwwroot\css\**\*.*" target="resource\wwwroot\css\" />
    <file src="wwwroot\js\**\*.*" target="resource\wwwroot\js\" />
    <file src="wwwroot\cldr-data\**\*.*" target="resource\wwwroot\cldr-data\" />

  </files>
</package>


build/.props
文件：

<Project>
  <Target Name="CopyFilesToProject" BeforeTargets="Build">
    <Message Text="Copy CSS files to project" />
    <ItemGroup>
      <SourceScripts Include="$(MSBuildThisFileDirectory)..\..\resource\**\*.* "/> <!--file from the nuget package-->
    </ItemGroup>
    <Copy
       SourceFiles="@(SourceScripts)"
       DestinationFiles="@(SourceScripts -> '$(MSBuildProjectDirectory)\%(RecursiveDir)%(Filename)%(Extension)')"
         />
  </Target>
</Project>


build/.targets
文件：

<?xml version="1.0" encoding="utf-8"?>
<Project ToolsVersion="4.0" xmlns="http://schemas.microsoft.com/developer/msbuild/2003">
  <Import Project="$(MSBuildThisFileDirectory)ACMELayoutWeb.props"/>
  <!--
  <Target Name="CopyJsCssFiles" AfterTargets="Build">
    <ItemGroup>
      <CssFiles Include="$(MSBuildThisFileDirectory)content\wwwroot\**\*.min.css" />
      <JsFiles Include="$(MSBuildThisFileDirectory)content\wwwroot\**\*.js" />
    </ItemGroup>
    <Copy SourceFiles="@(CssFiles)" DestinationFolder="$(ProjectDir)wwwroot" SkipUnchangedFiles="true" />
    <Copy SourceFiles="@(JsFiles)" DestinationFolder="$(ProjectDir)wwwroot" SkipUnchangedFiles="true" />
  </Target>
  -->
</Project>


root .props
文件：

<Project>
  <ItemGroup>
    <None Update="ACMELayoutWeb.targets">
      <CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
    </None>
  </ItemGroup>
</Project>


root .targets
文件：

<Project>
  <Import Project="$(MSBuildThisFileDirectory)ACMELayoutWeb.props"/>
</Project>

<!--<Project xmlns="http://schemas.microsoft.com/developer/msbuild/2003">
  <ItemGroup>
    <None Update="wwwroot/acme/css/*">
      <CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
    </None>
    <None Update="wwwroot/acme/js/*">
      <CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
    </None>
    <None Update="Views/Shared/_Layout.cshtml">
      <CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
    </None>
  </ItemGroup>
</Project>-->

<!--
<?xml version="1.0" encoding="utf-8"?>
<Project ToolsVersion="4.0" xmlns="http://schemas.microsoft.com/developer/msbuild/2003">
  <Target Name="CopyCssFiles" AfterTargets="Build">
    <ItemGroup>
      <CssFiles Include="$(MSBuildThisFileDirectory)staticwebassets\**\*.min.css" />
      <JsFiles Include="$(MSBuildThisFileDirectory)staticwebassets\**\*.js" />
    </ItemGroup>
    <Copy SourceFiles="@(CssFiles)" DestinationFolder="$(ProjectDir)wwwroot\" SkipUnchangedFiles="false" />
    <Copy SourceFiles="@(JsFiles)" DestinationFolder="$(ProjectDir)wwwroot\" SkipUnchangedFiles="false" />
  </Target>
  <ItemGroup>
    <None Include="$(MSBuildThisFileDirectory)staticwebassets\**\*.min.css">
      <Link>staticwebassets\**\*.min.css</Link>
      <CopyToOutputDirectory>Always</CopyToOutputDirectory>
    </None>
    <None Include="$(MSBuildThisFileDirectory)staticwebassets\**\*.js">
      <Link>staticwebassets\**\*.js</Link>
      <CopyToOutputDirectory>Always</CopyToOutputDirectory>
    </None>
  </ItemGroup>
</Project>
-->

生成的包：

谢谢！

c# .net asp.net-core .net-core nuget
1个回答
0
投票

好吧，几分钟后，我评论问你是否幸运，我能够做到这一点。您所要做的就是获取内容 URL，如下所示，其中 

DotnetAdmin
是我的包的 ID：

/_content/DotnetAdmin

然后是其余的 css\js。一切都像下面这样。我仍在试图找出它为什么会这样，在文档中没有找到它，我在一些开源包中找到了它。

<link rel="stylesheet" class="meta-css-light" href="/_content/DotnetAdmin/css/mvc-grid/mvc-grid.css" />
最新问题
© www.soinside.com 2019 - 2024. All rights reserved.