asp.net core 集成 vue cli

1,安装包 VueCliMiddleware 

2,startup.cs 添加代码

public IServiceProvider ConfigureServices(IServiceCollection services)
{
    services.AddSpaStaticFiles(options =>
    {
        options.RootPath = "ClientApp/dist";
    });
}


public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{ 

    app.UseStaticFiles();

    // dist 
    app.UseSpaStaticFiles();

    // app.UseMvc...

    app.UseSpa(b =>
    {
        b.Options.SourcePath = "ClientApp";
#if DEBUG
        if (env.IsDevelopment())
        {
            b.UseVueCli("serve");
        }
#endif

    });
}

 

3,csproj 添加

  <PropertyGroup>
    <TargetFramework>netcoreapp2.2</TargetFramework> 
<!-- add new line  -->
    <SpaRoot>ClientApp\</SpaRoot> 
  </PropertyGroup>
  
<Target Name="DebugEnsureNodeEnv" BeforeTargets="Build" Condition=" '$(Configuration)' == 'Debug' And !Exists('$(SpaRoot)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="$(SpaRoot)" Command="npm install" />
  </Target>

<Target Name="PublishRunWebpack" AfterTargets="ComputeFilesToPublish">
		<!-- As part of publishing, ensure the JS resources are freshly built in production mode -->
		<Exec WorkingDirectory="$(SpaRoot)" Command="npm run build">
			<Output TaskParameter="ExitCode" PropertyName="ErrorCode" />
		</Exec>
		<Error Condition="'$(ErrorCode)' != '0'" Text="Rum 'npm run build' command fail!" />

		<!-- Include the newly-built files in the publish output -->
		<ItemGroup>
			<DistFiles Include="$(SpaRoot)dist\**" />
			<ResolvedFileToPublish Include="@(DistFiles->'%(FullPath)')" Exclude="@(ResolvedFileToPublish)">
				<RelativePath>%(DistFiles.Identity)</RelativePath>
				<CopyToPublishDirectory>PreserveNewest</CopyToPublishDirectory>
			</ResolvedFileToPublish>
		</ItemGroup>
	</Target>

 

 

已禁用评论。