{"id":17045430,"url":"https://github.com/pikax/vuejsaspnetcoretemplate","last_synced_at":"2026-04-05T23:37:02.837Z","repository":{"id":76102869,"uuid":"166423762","full_name":"pikax/VueJsAspnetCoreTemplate","owner":"pikax","description":"Template to publish vuejs SPA using aspnet core ","archived":false,"fork":false,"pushed_at":"2019-01-18T15:30:21.000Z","size":378,"stargazers_count":2,"open_issues_count":0,"forks_count":0,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-01-28T08:51:14.649Z","etag":null,"topics":["dotnetcore","template","template-project","visual-studio","vuejs"],"latest_commit_sha":null,"homepage":null,"language":"Vue","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/pikax.png","metadata":{"files":{"readme":"readme.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2019-01-18T15:16:05.000Z","updated_at":"2022-10-17T13:30:05.000Z","dependencies_parsed_at":null,"dependency_job_id":"457b4b90-a74d-4e27-af8c-6385e0270449","html_url":"https://github.com/pikax/VueJsAspnetCoreTemplate","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pikax%2FVueJsAspnetCoreTemplate","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pikax%2FVueJsAspnetCoreTemplate/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pikax%2FVueJsAspnetCoreTemplate/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pikax%2FVueJsAspnetCoreTemplate/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/pikax","download_url":"https://codeload.github.com/pikax/VueJsAspnetCoreTemplate/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":245048276,"owners_count":20552483,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["dotnetcore","template","template-project","visual-studio","vuejs"],"created_at":"2024-10-14T09:37:24.415Z","updated_at":"2025-12-30T23:40:56.251Z","avatar_url":"https://github.com/pikax.png","language":"Vue","funding_links":[],"categories":[],"sub_categories":[],"readme":"# VueJsAspnetCore\n\nTemplate to integrate [VueJs](https://github.com/vuejs/vue) on [Visual Studio](https://visualstudio.microsoft.com/) aspnetcore project.\n\nPublish `.csproj` using `vuejs` as SPA \n\n\n# How to use\n\n## Requirements\nNeeds yarn, but you can adapt easily to use npm instead, just need to edit `.csproj`\n\n## Development\nFor development I recommend using \n`yarn serve`\nor \n`npm run serve`\n\n## Publish\n`dotnet publish`\nor \nusing Visual Studio\n\n\n# From the scratch\n\nCreate an empty aspnetcore project +2.0\n\n## Update *.csproj*\n\nAdd \n\n```xml\n\n  \u003c!-- Build and copy files on publish --\u003e\n  \u003cTarget Name=\"PublishRunWebpack\" AfterTargets=\"ComputeFilesToPublish\"\u003e\n    \u003c!-- As part of publishing, ensure the JS resources are freshly built in production mode --\u003e\n    \u003cExec Command=\"yarn\" /\u003e\n\n    \u003cExec Command=\"yarn build --mode production --dest dist --target app\" /\u003e\n    \u003c!-- Include the newly-built files in the publish output --\u003e\n    \u003cItemGroup\u003e\n      \u003cDistFiles Include=\"dist\\**\" /\u003e\n      \u003cResolvedFileToPublish Include=\"@(DistFiles-\u003e'%(FullPath)')\" Exclude=\"@(ResolvedFileToPublish)\"\u003e\n        \u003cRelativePath\u003e%(DistFiles.Identity)\u003c/RelativePath\u003e\n        \u003cCopyToPublishDirectory\u003ePreserveNewest\u003c/CopyToPublishDirectory\u003e\n      \u003c/ResolvedFileToPublish\u003e\n    \u003c/ItemGroup\u003e\n  \u003c/Target\u003e\n```\n\n### if using npm \nuse \n```xml\n\n  \u003c!-- Build and copy files on publish --\u003e\n  \u003cTarget Name=\"PublishRunWebpack\" AfterTargets=\"ComputeFilesToPublish\"\u003e\n    \u003c!-- As part of publishing, ensure the JS resources are freshly built in production mode --\u003e\n    \u003cExec Command=\"npm install\" /\u003e\n\n    \u003cExec Command=\"npm run build --mode production --dest dist --target app\" /\u003e\n    \u003c!-- Include the newly-built files in the publish output --\u003e\n    \u003cItemGroup\u003e\n      \u003cDistFiles Include=\"dist\\**\" /\u003e\n      \u003cResolvedFileToPublish Include=\"@(DistFiles-\u003e'%(FullPath)')\" Exclude=\"@(ResolvedFileToPublish)\"\u003e\n        \u003cRelativePath\u003e%(DistFiles.Identity)\u003c/RelativePath\u003e\n        \u003cCopyToPublishDirectory\u003ePreserveNewest\u003c/CopyToPublishDirectory\u003e\n      \u003c/ResolvedFileToPublish\u003e\n    \u003c/ItemGroup\u003e\n  \u003c/Target\u003e\n```\n\n\n## update `Startup.cs`\n\n\n### AddSpaStaticFiles\nAdd in ConfigureServices\n```csharp\n\nservices.AddSpaStaticFiles(x =\u003e\n{\n    x.RootPath = \"dist\"; // set static files to dist\n});\n```\n\nlike this\n```csharp\npublic void ConfigureServices(IServiceCollection services)\n{\n    services.AddSpaStaticFiles(x =\u003e\n    {\n        x.RootPath = \"dist\"; // set static files to dist\n    });\n}\n```\n\n\n### Configure\nAdd in Configure\n```csharp\napp.UseSpaStaticFiles(new StaticFileOptions()\n{\n#if !DEBUG\n    OnPrepareResponse = ctx =\u003e\n    {\n        // https://developers.google.com/web/fundamentals/performance/webpack/use-long-term-caching\n        ctx.Context.Response.Headers[HeaderNames.CacheControl] = \"max-age=\" + 31536000;\n    }  \n#endif\n});\napp.UseSpa(x =\u003e\n{\n    x.Options.DefaultPage = \"/index.html\";\n});\n```\n\n\n\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpikax%2Fvuejsaspnetcoretemplate","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fpikax%2Fvuejsaspnetcoretemplate","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpikax%2Fvuejsaspnetcoretemplate/lists"}