├── .gitignore ├── LICENSE ├── README.md ├── README.ru-ru.md ├── StarterVueMvc.sln ├── TryVueMvc ├── ClientApp │ ├── components │ │ ├── AppHello.html │ │ ├── AppHello.ts │ │ ├── Hello.html │ │ └── Hello.ts │ ├── css │ │ └── site.css │ └── index.ts ├── Controllers │ └── HomeController.cs ├── Models │ └── ErrorViewModel.cs ├── Program.cs ├── Properties │ └── launchSettings.json ├── Startup.cs ├── TryVueMvc.csproj ├── Views │ ├── Home │ │ ├── About.cshtml │ │ ├── Contact.cshtml │ │ └── Index.cshtml │ ├── Shared │ │ ├── Error.cshtml │ │ ├── _Layout.cshtml │ │ └── _ValidationScriptsPartial.cshtml │ ├── _ViewImports.cshtml │ └── _ViewStart.cshtml ├── appsettings.Development.json ├── appsettings.json ├── bundleconfig.json ├── package.json ├── tsconfig.json └── wwwroot │ └── favicon.ico ├── TryVueMvcDecorator ├── ClientApp │ ├── components │ │ ├── AppHello.html │ │ ├── AppHello.ts │ │ ├── Hello.html │ │ └── Hello.ts │ ├── css │ │ └── site.css │ └── index.ts ├── Controllers │ └── HomeController.cs ├── Models │ └── ErrorViewModel.cs ├── Program.cs ├── Properties │ └── launchSettings.json ├── Startup.cs ├── TryVueMvcDecorator.csproj ├── Views │ ├── Home │ │ ├── About.cshtml │ │ ├── Contact.cshtml │ │ └── Index.cshtml │ ├── Shared │ │ ├── Error.cshtml │ │ ├── _Layout.cshtml │ │ └── _ValidationScriptsPartial.cshtml │ ├── _ViewImports.cshtml │ └── _ViewStart.cshtml ├── appsettings.Development.json ├── appsettings.json ├── bundleconfig.json ├── package.json ├── tsconfig.json └── wwwroot │ └── favicon.ico ├── TryVueMvcGrid ├── ClientApp │ ├── components │ │ ├── AppGrid.html │ │ ├── AppGrid.ts │ │ ├── DemoGrid.html │ │ └── DemoGrid.ts │ ├── css │ │ ├── demo-grid.css │ │ └── site.css │ └── index.ts ├── Controllers │ └── HomeController.cs ├── Models │ └── ErrorViewModel.cs ├── Program.cs ├── Properties │ └── launchSettings.json ├── Startup.cs ├── TryVueMvcGrid.csproj ├── Views │ ├── Home │ │ ├── About.cshtml │ │ ├── Contact.cshtml │ │ └── Index.cshtml │ ├── Shared │ │ ├── Error.cshtml │ │ ├── _Layout.cshtml │ │ └── _ValidationScriptsPartial.cshtml │ ├── _ViewImports.cshtml │ └── _ViewStart.cshtml ├── appsettings.Development.json ├── appsettings.json ├── bundleconfig.json ├── package.json ├── tsconfig.json └── wwwroot │ └── favicon.ico └── vue+aspnet+ts-bootstrap+require.png /.gitignore: -------------------------------------------------------------------------------- 1 | .vs 2 | .gitattributes 3 | 4 | *.user 5 | 6 | [Bb]in/ 7 | [Oo]bj/ 8 | dist/ 9 | vendor/ 10 | built/ 11 | 12 | node_modules/ 13 | package-lock.json -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2018 Eduard Schavelev 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | [на русском языке](README.ru-ru.md) 2 | # StarterVueMvc 3 | 4 | ![image](vue+aspnet+ts-bootstrap+require.png?raw=true "image") 5 | 6 | Starter application Vue.js + Asp.Net Core MVC + TypeScript + Bootstrap4. A solution for Visual Studio 2017 with 3 independent projects: 7 | - TryVueMvc 8 | - TryVueMvcDecorator 9 | - TryVueMvcGrid 10 | 11 | Also used as an example for articles on habrahabr.ru (in Russian): 12 | - [Vue.js + Asp.Net Core MVC + TypeScript and also Bootstrap4](https://habrahabr.ru/post/350332/); 13 | - [Strict typing for Vue.js applications on TypeScript](https://habrahabr.ru/post/351216/); 14 | 15 | # Installation 16 | 17 | Clone the repository to your computer. 18 | 19 | ```dos 20 | git clone https://github.com/schavelev/starter-vue-mvc.git 21 | ``` 22 | 23 | Install the [Bundler & Minifier extension](https://marketplace.visualstudio.com/items?itemName=MadsKristensen.BundlerMinifier). 24 | 25 | # Building and running 26 | 27 | Building and running the application is traditional for the VS2017 environment. Bandling can be done through the "Bundler & Minifier \ Update Bundles" command of the local menu on the bundleconfig.json file. 28 | 29 | You can also build and run through the command line in the project directory: 30 | ```dos 31 | npm install 32 | dotnet build 33 | dotnet bundle 34 | dotnet run 35 | ``` 36 | Open a page in the browser at the specified address. For example http: // localhost: 51766. 37 | -------------------------------------------------------------------------------- /README.ru-ru.md: -------------------------------------------------------------------------------- 1 | [in English](README.md) 2 | # StarterVueMvc 3 | 4 | ![image](vue+aspnet+ts-bootstrap+require.png?raw=true "image") 5 | 6 | 7 | Заготовка для приложений Vue.js + Asp.Net Core MVC + TypeScript + Bootstrap4. Решение Visual Studio 2017 с тремя независимыми проектами: 8 | - TryVueMvc 9 | - TryVueMvcDecorator 10 | - TryVueMvcGrid 11 | 12 | Также используется в качестве примера для статей на habrahabr.ru: 13 | - [Vue.js + Asp.Net Core MVC + TypeScript и ещё Bootstrap4](https://habrahabr.ru/post/350332/); 14 | - [Строгая типизация для приложений Vue.js на TypeScript](https://habrahabr.ru/post/351216/); 15 | 16 | # Установка 17 | 18 | Клонировать этот репозиторий на свой компьютер. 19 | ```dos 20 | git clone https://github.com/schavelev/starter-vue-mvc.git 21 | ``` 22 | 23 | Установить расширение к VS2017: [Bundler & Minifier](https://marketplace.visualstudio.com/items?itemName=MadsKristensen.BundlerMinifier). 24 | 25 | # Сборка и запуск проекта 26 | 27 | Сборка и запуск приложения - традиционное для среды VS2017. Бандлинг производится через команду "Bundler&Minifier\Update Bundles" локального меню на файле bundleconfig.json. 28 | 29 | Также сборку и запуск можно произвести через командную строку в каталоге проекта: 30 | ```dos 31 | npm install 32 | dotnet build 33 | dotnet bundle 34 | dotnet run 35 | ``` 36 | В браузере открываем страницу по указанному адресу, например, http://localhost:51766. 37 | -------------------------------------------------------------------------------- /StarterVueMvc.sln: -------------------------------------------------------------------------------- 1 |  2 | Microsoft Visual Studio Solution File, Format Version 12.00 3 | # Visual Studio 15 4 | VisualStudioVersion = 15.0.27130.2010 5 | MinimumVisualStudioVersion = 10.0.40219.1 6 | Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "TryVueMvc", "TryVueMvc\TryVueMvc.csproj", "{CE307A49-5E7C-4260-B332-43CA09174320}" 7 | EndProject 8 | Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = "Solution items", "Solution items", "{438EECCE-FE30-404F-917A-E620365A3B72}" 9 | ProjectSection(SolutionItems) = preProject 10 | LICENSE = LICENSE 11 | README.md = README.md 12 | README.ru-ru.md = README.ru-ru.md 13 | EndProjectSection 14 | EndProject 15 | Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "TryVueMvcDecorator", "TryVueMvcDecorator\TryVueMvcDecorator.csproj", "{225E9391-A9C3-47E7-B853-F4617A669B56}" 16 | EndProject 17 | Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "TryVueMvcGrid", "TryVueMvcGrid\TryVueMvcGrid.csproj", "{13456F9F-A1DE-450E-973B-276C09BC0E21}" 18 | EndProject 19 | Global 20 | GlobalSection(SolutionConfigurationPlatforms) = preSolution 21 | Debug|Any CPU = Debug|Any CPU 22 | Release|Any CPU = Release|Any CPU 23 | EndGlobalSection 24 | GlobalSection(ProjectConfigurationPlatforms) = postSolution 25 | {CE307A49-5E7C-4260-B332-43CA09174320}.Debug|Any CPU.ActiveCfg = Debug|Any CPU 26 | {CE307A49-5E7C-4260-B332-43CA09174320}.Debug|Any CPU.Build.0 = Debug|Any CPU 27 | {CE307A49-5E7C-4260-B332-43CA09174320}.Release|Any CPU.ActiveCfg = Release|Any CPU 28 | {CE307A49-5E7C-4260-B332-43CA09174320}.Release|Any CPU.Build.0 = Release|Any CPU 29 | {225E9391-A9C3-47E7-B853-F4617A669B56}.Debug|Any CPU.ActiveCfg = Debug|Any CPU 30 | {225E9391-A9C3-47E7-B853-F4617A669B56}.Debug|Any CPU.Build.0 = Debug|Any CPU 31 | {225E9391-A9C3-47E7-B853-F4617A669B56}.Release|Any CPU.ActiveCfg = Release|Any CPU 32 | {225E9391-A9C3-47E7-B853-F4617A669B56}.Release|Any CPU.Build.0 = Release|Any CPU 33 | {13456F9F-A1DE-450E-973B-276C09BC0E21}.Debug|Any CPU.ActiveCfg = Debug|Any CPU 34 | {13456F9F-A1DE-450E-973B-276C09BC0E21}.Debug|Any CPU.Build.0 = Debug|Any CPU 35 | {13456F9F-A1DE-450E-973B-276C09BC0E21}.Release|Any CPU.ActiveCfg = Release|Any CPU 36 | {13456F9F-A1DE-450E-973B-276C09BC0E21}.Release|Any CPU.Build.0 = Release|Any CPU 37 | EndGlobalSection 38 | GlobalSection(SolutionProperties) = preSolution 39 | HideSolutionNode = FALSE 40 | EndGlobalSection 41 | GlobalSection(ExtensibilityGlobals) = postSolution 42 | SolutionGuid = {443FCF20-28BB-4B71-B219-48638EFE2D1B} 43 | EndGlobalSection 44 | EndGlobal 45 | -------------------------------------------------------------------------------- /TryVueMvc/ClientApp/components/AppHello.html: -------------------------------------------------------------------------------- 1 |  2 | 8 | -------------------------------------------------------------------------------- /TryVueMvc/ClientApp/components/AppHello.ts: -------------------------------------------------------------------------------- 1 | // ClientApp/components/AppHello.ts 2 | import Vue from "vue"; 3 | import HelloComponent from "./Hello"; 4 | 5 | export default Vue.extend({ 6 | template:'#app-hello-template', 7 | data() { 8 | return { 9 | name: "World" 10 | } 11 | }, 12 | components: { 13 | HelloComponent 14 | } 15 | }); -------------------------------------------------------------------------------- /TryVueMvc/ClientApp/components/Hello.html: -------------------------------------------------------------------------------- 1 |  2 | 9 | -------------------------------------------------------------------------------- /TryVueMvc/ClientApp/components/Hello.ts: -------------------------------------------------------------------------------- 1 | // ClientApp/components/Hello.ts 2 | import Vue from "vue"; 3 | 4 | export default Vue.extend({ 5 | template:'#hello-template', 6 | props: ['name', 'initialEnthusiasm'], 7 | data() { 8 | return { 9 | enthusiasm: this.initialEnthusiasm 10 | } 11 | }, 12 | methods: { 13 | increment() { this.enthusiasm++; }, 14 | decrement() { 15 | if (this.enthusiasm > 1) { 16 | this.enthusiasm--; 17 | } 18 | }, 19 | }, 20 | computed: { 21 | exclamationMarks(): string { 22 | return Array(this.enthusiasm + 1).join('!'); 23 | } 24 | } 25 | }); -------------------------------------------------------------------------------- /TryVueMvc/ClientApp/css/site.css: -------------------------------------------------------------------------------- 1 | /* ClientApp/css/site.css */ 2 | body { 3 | margin: 5rem; 4 | background-color: honeydew; 5 | } -------------------------------------------------------------------------------- /TryVueMvc/ClientApp/index.ts: -------------------------------------------------------------------------------- 1 | // ClientApp/index.ts 2 | import Vue from "vue"; 3 | import AppHelloComponent from "./components/AppHello"; 4 | 5 | let v = new Vue({ 6 | el: "#app-root", 7 | template: '', 8 | //render: h => h(AppHelloComponent), 9 | components: { 10 | AppHelloComponent 11 | } 12 | }); -------------------------------------------------------------------------------- /TryVueMvc/Controllers/HomeController.cs: -------------------------------------------------------------------------------- 1 | using System; 2 | using System.Collections.Generic; 3 | using System.Diagnostics; 4 | using System.Linq; 5 | using System.Threading.Tasks; 6 | using Microsoft.AspNetCore.Mvc; 7 | using TryVueMvc.Models; 8 | 9 | namespace TryVueMvc.Controllers 10 | { 11 | public class HomeController : Controller 12 | { 13 | public IActionResult Index() 14 | { 15 | return View(); 16 | } 17 | 18 | public IActionResult About() 19 | { 20 | ViewData["Message"] = "Your application description page."; 21 | 22 | return View(); 23 | } 24 | 25 | public IActionResult Contact() 26 | { 27 | ViewData["Message"] = "Your contact page."; 28 | 29 | return View(); 30 | } 31 | 32 | public IActionResult Error() 33 | { 34 | return View(new ErrorViewModel { RequestId = Activity.Current?.Id ?? HttpContext.TraceIdentifier }); 35 | } 36 | } 37 | } 38 | -------------------------------------------------------------------------------- /TryVueMvc/Models/ErrorViewModel.cs: -------------------------------------------------------------------------------- 1 | using System; 2 | 3 | namespace TryVueMvc.Models 4 | { 5 | public class ErrorViewModel 6 | { 7 | public string RequestId { get; set; } 8 | 9 | public bool ShowRequestId => !string.IsNullOrEmpty(RequestId); 10 | } 11 | } -------------------------------------------------------------------------------- /TryVueMvc/Program.cs: -------------------------------------------------------------------------------- 1 | using System; 2 | using System.Collections.Generic; 3 | using System.IO; 4 | using System.Linq; 5 | using System.Threading.Tasks; 6 | using Microsoft.AspNetCore; 7 | using Microsoft.AspNetCore.Hosting; 8 | using Microsoft.Extensions.Configuration; 9 | using Microsoft.Extensions.Logging; 10 | 11 | namespace TryVueMvc 12 | { 13 | public class Program 14 | { 15 | public static void Main(string[] args) 16 | { 17 | CreateWebHostBuilder(args).Build().Run(); 18 | } 19 | 20 | public static IWebHostBuilder CreateWebHostBuilder(string[] args) => 21 | WebHost.CreateDefaultBuilder(args) 22 | .UseStartup(); 23 | } 24 | } 25 | -------------------------------------------------------------------------------- /TryVueMvc/Properties/launchSettings.json: -------------------------------------------------------------------------------- 1 | { 2 | "iisSettings": { 3 | "windowsAuthentication": false, 4 | "anonymousAuthentication": true, 5 | "iisExpress": { 6 | "applicationUrl": "http://localhost:51765", 7 | "sslPort": 0 8 | } 9 | }, 10 | "profiles": { 11 | "IIS Express": { 12 | "commandName": "IISExpress", 13 | "launchBrowser": true, 14 | "environmentVariables": { 15 | "ASPNETCORE_ENVIRONMENT": "Development" 16 | } 17 | }, 18 | "TryVueMvc": { 19 | "commandName": "Project", 20 | "launchBrowser": true, 21 | "environmentVariables": { 22 | "ASPNETCORE_ENVIRONMENT": "Development" 23 | }, 24 | "applicationUrl": "http://localhost:5000" 25 | } 26 | } 27 | } 28 | -------------------------------------------------------------------------------- /TryVueMvc/Startup.cs: -------------------------------------------------------------------------------- 1 | using System; 2 | using System.Collections.Generic; 3 | using System.Linq; 4 | using System.Threading.Tasks; 5 | using Microsoft.AspNetCore.Builder; 6 | using Microsoft.AspNetCore.Hosting; 7 | using Microsoft.AspNetCore.Http; 8 | using Microsoft.AspNetCore.Mvc; 9 | using Microsoft.Extensions.Configuration; 10 | using Microsoft.Extensions.DependencyInjection; 11 | 12 | namespace TryVueMvc 13 | { 14 | public class Startup 15 | { 16 | public Startup(IConfiguration configuration) 17 | { 18 | Configuration = configuration; 19 | } 20 | 21 | public IConfiguration Configuration { get; } 22 | 23 | // This method gets called by the runtime. Use this method to add services to the container. 24 | public void ConfigureServices(IServiceCollection services) 25 | { 26 | services.AddMvc().SetCompatibilityVersion(CompatibilityVersion.Version_2_2); 27 | } 28 | 29 | // This method gets called by the runtime. Use this method to configure the HTTP request pipeline. 30 | public void Configure(IApplicationBuilder app, IHostingEnvironment env) 31 | { 32 | if (env.IsDevelopment()) 33 | { 34 | app.UseDeveloperExceptionPage(); 35 | } 36 | else 37 | { 38 | app.UseExceptionHandler("/Home/Error"); 39 | } 40 | 41 | app.UseStaticFiles(); 42 | 43 | app.UseMvc(routes => 44 | { 45 | routes.MapRoute( 46 | name: "default", 47 | template: "{controller=Home}/{action=Index}/{id?}"); 48 | }); 49 | } 50 | } 51 | } 52 | -------------------------------------------------------------------------------- /TryVueMvc/TryVueMvc.csproj: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | netcoreapp2.2 5 | InProcess 6 | Latest 7 | 8 | 9 | 10 | 11 | 12 | 13 | all 14 | runtime; build; native; contentfiles; analyzers 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | -------------------------------------------------------------------------------- /TryVueMvc/Views/Home/About.cshtml: -------------------------------------------------------------------------------- 1 | @{ 2 | ViewData["Title"] = "About"; 3 | } 4 |

@ViewData["Title"]

5 |

@ViewData["Message"]

6 | 7 |

Use this area to provide additional information.

8 | -------------------------------------------------------------------------------- /TryVueMvc/Views/Home/Contact.cshtml: -------------------------------------------------------------------------------- 1 | @{ 2 | ViewData["Title"] = "Contact"; 3 | } 4 |

@ViewData["Title"]

5 |

@ViewData["Message"]

6 | 7 |
8 | One Microsoft Way
9 | Redmond, WA 98052-6399
10 | P: 11 | 425.555.0100 12 |
13 | 14 |
15 | Support: Support@example.com
16 | Marketing: Marketing@example.com 17 |
18 | -------------------------------------------------------------------------------- /TryVueMvc/Views/Home/Index.cshtml: -------------------------------------------------------------------------------- 1 | @* Views/Home/Index.cshtml *@ 2 | @using Microsoft.AspNetCore.Hosting 3 | @inject IHostingEnvironment hostingEnv 4 | @{ 5 | var vueUrl = hostingEnv.IsDevelopment() ? "/dist/vendor2.js" : "/dist/vendor2.min.js"; 6 | var mainUrl = hostingEnv.IsDevelopment() ? "/dist/app-bandle.js" : "/dist/app-bandle.min.js"; 7 | 8 | ViewData["Title"] = "TryVueMvc Sample"; 9 | } 10 |
11 |
loading..
12 | @section Scripts{ 13 | 20 | 21 | 30 | } 31 | -------------------------------------------------------------------------------- /TryVueMvc/Views/Shared/Error.cshtml: -------------------------------------------------------------------------------- 1 | @model ErrorViewModel 2 | @{ 3 | ViewData["Title"] = "Error"; 4 | } 5 | 6 |

Error.

7 |

An error occurred while processing your request.

8 | 9 | @if (Model.ShowRequestId) 10 | { 11 |

12 | Request ID: @Model.RequestId 13 |

14 | } 15 | 16 |

Development Mode

17 |

18 | Swapping to Development environment will display more detailed information about the error that occurred. 19 |

20 |

21 | Development environment should not be enabled in deployed applications, as it can result in sensitive information from exceptions being displayed to end users. For local debugging, development environment can be enabled by setting the ASPNETCORE_ENVIRONMENT environment variable to Development, and restarting the application. 22 |

23 | -------------------------------------------------------------------------------- /TryVueMvc/Views/Shared/_Layout.cshtml: -------------------------------------------------------------------------------- 1 |  2 | 3 | 4 | 5 | 6 | @ViewData["Title"] - TryVueMvc 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 32 |
33 | @RenderBody() 34 |
35 |
36 |

© 2018 - Company

37 |
38 |
39 | 40 | 41 | 42 | 43 | 44 | 45 | @RenderSection("Scripts", required: false) 46 | 47 | 48 | -------------------------------------------------------------------------------- /TryVueMvc/Views/Shared/_ValidationScriptsPartial.cshtml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 12 | 18 | 19 | -------------------------------------------------------------------------------- /TryVueMvc/Views/_ViewImports.cshtml: -------------------------------------------------------------------------------- 1 | @using TryVueMvc 2 | @using TryVueMvc.Models 3 | @addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers 4 | -------------------------------------------------------------------------------- /TryVueMvc/Views/_ViewStart.cshtml: -------------------------------------------------------------------------------- 1 | @{ 2 | Layout = "_Layout"; 3 | } 4 | -------------------------------------------------------------------------------- /TryVueMvc/appsettings.Development.json: -------------------------------------------------------------------------------- 1 | { 2 | "Logging": { 3 | "IncludeScopes": false, 4 | "LogLevel": { 5 | "Default": "Debug", 6 | "System": "Information", 7 | "Microsoft": "Information" 8 | } 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /TryVueMvc/appsettings.json: -------------------------------------------------------------------------------- 1 | { 2 | "Logging": { 3 | "IncludeScopes": false, 4 | "LogLevel": { 5 | "Default": "Warning" 6 | } 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /TryVueMvc/bundleconfig.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "outputFileName": "wwwroot/dist/vendor1.js", 4 | "inputFiles": [ 5 | "node_modules/jquery/dist/jquery.js", 6 | "node_modules/popper.js/dist/umd/popper.js", 7 | "node_modules/bootstrap/dist/js/bootstrap.js", 8 | "node_modules/systemjs/dist/system.js", 9 | "node_modules/systemjs/dist/extras/named-register.js" 10 | ], 11 | "minify": { 12 | "enabled": true, 13 | "renameLocals": true 14 | }, 15 | "sourceMap": true 16 | }, 17 | { 18 | "outputFileName": "wwwroot/dist/vendor1.css", 19 | "inputFiles": [ 20 | "node_modules/bootstrap/dist/css/bootstrap.css" 21 | ], 22 | "minify": { 23 | "enabled": false 24 | } 25 | }, 26 | { 27 | "outputFileName": "wwwroot/dist/vendor1.min.css", 28 | "inputFiles": [ 29 | "node_modules/bootstrap/dist/css/bootstrap.min.css" 30 | ], 31 | "minify": { 32 | "enabled": false 33 | } 34 | }, 35 | { 36 | "outputFileName": "wwwroot/dist/vendor2.js", 37 | "inputFiles": [ 38 | "node_modules/vue/dist/vue.js" 39 | ], 40 | "minify": { 41 | "enabled": true, 42 | "renameLocals": true 43 | }, 44 | "sourceMap": true 45 | }, 46 | { 47 | "outputFileName": "wwwroot/dist/main.css", 48 | "inputFiles": [ 49 | "ClientApp/**/*.css" 50 | ], 51 | "minify": { 52 | "enabled": true 53 | } 54 | }, 55 | { 56 | "outputFileName": "wwwroot/dist/app-bandle.min.js", 57 | "inputFiles": [ 58 | "wwwroot/dist/app-bandle.js" 59 | ], 60 | "minify": { 61 | "enabled": true, 62 | "renameLocals": true 63 | } 64 | }, 65 | { 66 | "outputFileName": "wwwroot/dist/app-templates.html", 67 | "inputFiles": [ 68 | "ClientApp/**/*.html" 69 | ], 70 | "minify": { 71 | "enabled": false, 72 | "renameLocals": false 73 | } 74 | } 75 | ] 76 | 77 | -------------------------------------------------------------------------------- /TryVueMvc/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "version": "1.0.0", 3 | "name": "asp.net", 4 | "private": true, 5 | "dependencies": { 6 | "jquery": "^3.4.1", 7 | "popper.js": "^1.15.0", 8 | "bootstrap": "^4.3.1", 9 | "vue": "^2.6.10", 10 | "systemjs": "^3.1.6" 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /TryVueMvc/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "removeComments": false, 4 | "sourceMap": true, 5 | "target": "es5", 6 | "module": "system", 7 | "outFile": "wwwroot/dist/app-bandle.js", 8 | "moduleResolution": "node", 9 | "esModuleInterop": true, 10 | //"noImplicitThis": true, 11 | //"noImplicitAny": true, 12 | //"alwaysStrict": true, 13 | //"strictNullChecks": true, 14 | //"strictFunctionTypes": true, 15 | //"strictPropertyInitialization": true, 16 | //"strict": true, 17 | //"noUnusedLocals": true, 18 | //"noUnusedParameters": true, 19 | "noEmitOnError": true 20 | }, 21 | "include": [ 22 | "./ClientApp/**/*.ts" 23 | ] 24 | } 25 | -------------------------------------------------------------------------------- /TryVueMvc/wwwroot/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/schavelev/starter-vue-mvc/1147fddb29ca35e8a6003660535891c41b7e1375/TryVueMvc/wwwroot/favicon.ico -------------------------------------------------------------------------------- /TryVueMvcDecorator/ClientApp/components/AppHello.html: -------------------------------------------------------------------------------- 1 |  2 | 8 | -------------------------------------------------------------------------------- /TryVueMvcDecorator/ClientApp/components/AppHello.ts: -------------------------------------------------------------------------------- 1 | // ClientApp/components/AppHello.ts 2 | import Vue from "vue"; 3 | import Component from "vue-class-component"; 4 | import HelloComponent from "./Hello"; 5 | 6 | @Component({ 7 | template: '#app-hello-template', 8 | components: { 9 | HelloComponent 10 | } 11 | }) 12 | export default class AppHelloComponent extends Vue { 13 | data() { 14 | return { 15 | name: "World" 16 | } 17 | } 18 | }; -------------------------------------------------------------------------------- /TryVueMvcDecorator/ClientApp/components/Hello.html: -------------------------------------------------------------------------------- 1 |  2 | 9 | -------------------------------------------------------------------------------- /TryVueMvcDecorator/ClientApp/components/Hello.ts: -------------------------------------------------------------------------------- 1 | // ClientApp/components/Hello.ts 2 | import Vue from "vue"; 3 | import Component from "vue-class-component"; 4 | 5 | @Component({ 6 | template: '#hello-template', 7 | props: ['name', 'initialEnthusiasm'] 8 | }) 9 | export default class HelloComponent extends Vue { 10 | enthusiasm!: number; 11 | initialEnthusiasm!: number; 12 | 13 | data() { 14 | return { 15 | enthusiasm: this.initialEnthusiasm 16 | } 17 | }; 18 | 19 | // methods: 20 | increment() { this.enthusiasm++; }; 21 | decrement() { 22 | if (this.enthusiasm > 1) { 23 | this.enthusiasm--; 24 | } 25 | }; 26 | 27 | // computed: 28 | get exclamationMarks() { 29 | return Array(this.enthusiasm + 1).join('!'); 30 | } 31 | }; -------------------------------------------------------------------------------- /TryVueMvcDecorator/ClientApp/css/site.css: -------------------------------------------------------------------------------- 1 | /* ClientApp/css/site.css */ 2 | body { 3 | margin: 5rem; 4 | background-color: honeydew; 5 | } -------------------------------------------------------------------------------- /TryVueMvcDecorator/ClientApp/index.ts: -------------------------------------------------------------------------------- 1 | // ClientApp/index.ts 2 | import Vue from "vue"; 3 | import AppHelloComponent from "./components/AppHello"; 4 | 5 | new Vue({ 6 | el: "#app-root", 7 | template: '', 8 | //render: h => h(AppHelloComponent), 9 | components: { 10 | AppHelloComponent 11 | } 12 | }); 13 | -------------------------------------------------------------------------------- /TryVueMvcDecorator/Controllers/HomeController.cs: -------------------------------------------------------------------------------- 1 | using System; 2 | using System.Collections.Generic; 3 | using System.Diagnostics; 4 | using System.Linq; 5 | using System.Threading.Tasks; 6 | using Microsoft.AspNetCore.Mvc; 7 | using TryVueMvcDecorator.Models; 8 | 9 | namespace TryVueMvcDecorator.Controllers 10 | { 11 | public class HomeController : Controller 12 | { 13 | public IActionResult Index() 14 | { 15 | return View(); 16 | } 17 | 18 | public IActionResult About() 19 | { 20 | ViewData["Message"] = "Your application description page."; 21 | 22 | return View(); 23 | } 24 | 25 | public IActionResult Contact() 26 | { 27 | ViewData["Message"] = "Your contact page."; 28 | 29 | return View(); 30 | } 31 | 32 | public IActionResult Error() 33 | { 34 | return View(new ErrorViewModel { RequestId = Activity.Current?.Id ?? HttpContext.TraceIdentifier }); 35 | } 36 | } 37 | } 38 | -------------------------------------------------------------------------------- /TryVueMvcDecorator/Models/ErrorViewModel.cs: -------------------------------------------------------------------------------- 1 | using System; 2 | 3 | namespace TryVueMvcDecorator.Models 4 | { 5 | public class ErrorViewModel 6 | { 7 | public string RequestId { get; set; } 8 | 9 | public bool ShowRequestId => !string.IsNullOrEmpty(RequestId); 10 | } 11 | } -------------------------------------------------------------------------------- /TryVueMvcDecorator/Program.cs: -------------------------------------------------------------------------------- 1 | using System; 2 | using System.Collections.Generic; 3 | using System.IO; 4 | using System.Linq; 5 | using System.Threading.Tasks; 6 | using Microsoft.AspNetCore; 7 | using Microsoft.AspNetCore.Hosting; 8 | using Microsoft.Extensions.Configuration; 9 | using Microsoft.Extensions.Logging; 10 | 11 | namespace TryVueMvcDecorator 12 | { 13 | public class Program 14 | { 15 | public static void Main(string[] args) 16 | { 17 | CreateWebHostBuilder(args).Build().Run(); 18 | } 19 | 20 | public static IWebHostBuilder CreateWebHostBuilder(string[] args) => 21 | WebHost.CreateDefaultBuilder(args) 22 | .UseStartup(); 23 | } 24 | } 25 | -------------------------------------------------------------------------------- /TryVueMvcDecorator/Properties/launchSettings.json: -------------------------------------------------------------------------------- 1 | { 2 | "iisSettings": { 3 | "windowsAuthentication": false, 4 | "anonymousAuthentication": true, 5 | "iisExpress": { 6 | "applicationUrl": "http://localhost:56576", 7 | "sslPort": 0 8 | } 9 | }, 10 | "profiles": { 11 | "IIS Express": { 12 | "commandName": "IISExpress", 13 | "launchBrowser": true, 14 | "environmentVariables": { 15 | "ASPNETCORE_ENVIRONMENT": "Development" 16 | } 17 | }, 18 | "TryVueMvcDecorator": { 19 | "commandName": "Project", 20 | "launchBrowser": true, 21 | "environmentVariables": { 22 | "ASPNETCORE_ENVIRONMENT": "Development" 23 | }, 24 | "applicationUrl": "http://localhost:5000" 25 | } 26 | } 27 | } 28 | -------------------------------------------------------------------------------- /TryVueMvcDecorator/Startup.cs: -------------------------------------------------------------------------------- 1 | using System; 2 | using System.Collections.Generic; 3 | using System.Linq; 4 | using System.Threading.Tasks; 5 | using Microsoft.AspNetCore.Builder; 6 | using Microsoft.AspNetCore.Hosting; 7 | using Microsoft.AspNetCore.Http; 8 | using Microsoft.AspNetCore.Mvc; 9 | using Microsoft.Extensions.Configuration; 10 | using Microsoft.Extensions.DependencyInjection; 11 | 12 | namespace TryVueMvcDecorator 13 | { 14 | public class Startup 15 | { 16 | public Startup(IConfiguration configuration) 17 | { 18 | Configuration = configuration; 19 | } 20 | 21 | public IConfiguration Configuration { get; } 22 | 23 | // This method gets called by the runtime. Use this method to add services to the container. 24 | public void ConfigureServices(IServiceCollection services) 25 | { 26 | services.AddMvc().SetCompatibilityVersion(CompatibilityVersion.Version_2_2); 27 | } 28 | 29 | // This method gets called by the runtime. Use this method to configure the HTTP request pipeline. 30 | public void Configure(IApplicationBuilder app, IHostingEnvironment env) 31 | { 32 | if (env.IsDevelopment()) 33 | { 34 | app.UseDeveloperExceptionPage(); 35 | } 36 | else 37 | { 38 | app.UseExceptionHandler("/Home/Error"); 39 | } 40 | 41 | app.UseStaticFiles(); 42 | 43 | app.UseMvc(routes => 44 | { 45 | routes.MapRoute( 46 | name: "default", 47 | template: "{controller=Home}/{action=Index}/{id?}"); 48 | }); 49 | } 50 | } 51 | } 52 | -------------------------------------------------------------------------------- /TryVueMvcDecorator/TryVueMvcDecorator.csproj: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | netcoreapp2.2 5 | InProcess 6 | Latest 7 | 8 | 9 | 10 | 11 | 12 | 13 | all 14 | runtime; build; native; contentfiles; analyzers 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | -------------------------------------------------------------------------------- /TryVueMvcDecorator/Views/Home/About.cshtml: -------------------------------------------------------------------------------- 1 | @{ 2 | ViewData["Title"] = "About"; 3 | } 4 |

@ViewData["Title"]

5 |

@ViewData["Message"]

6 | 7 |

Use this area to provide additional information.

8 | -------------------------------------------------------------------------------- /TryVueMvcDecorator/Views/Home/Contact.cshtml: -------------------------------------------------------------------------------- 1 | @{ 2 | ViewData["Title"] = "Contact"; 3 | } 4 |

@ViewData["Title"]

5 |

@ViewData["Message"]

6 | 7 |
8 | One Microsoft Way
9 | Redmond, WA 98052-6399
10 | P: 11 | 425.555.0100 12 |
13 | 14 |
15 | Support: Support@example.com
16 | Marketing: Marketing@example.com 17 |
18 | -------------------------------------------------------------------------------- /TryVueMvcDecorator/Views/Home/Index.cshtml: -------------------------------------------------------------------------------- 1 | @* Views/Home/Index.cshtml *@ 2 | @using Microsoft.AspNetCore.Hosting 3 | @inject IHostingEnvironment hostingEnv 4 | @{ 5 | var suffix = hostingEnv.IsDevelopment() ? "" : ".min"; 6 | var vueUrl = $"vendor/vue{suffix}.js"; 7 | var vueClassComponentUrl = $"vendor/vue-class-component{suffix}.js"; 8 | var mainUrl = $"dist/app-bandle{suffix}.js"; 9 | 10 | ViewData["Title"] = "TryVueMvc Sample"; 11 | } 12 |
13 |
loading..
14 | @section Scripts{ 15 | 31 | } 32 | -------------------------------------------------------------------------------- /TryVueMvcDecorator/Views/Shared/Error.cshtml: -------------------------------------------------------------------------------- 1 | @model ErrorViewModel 2 | @{ 3 | ViewData["Title"] = "Error"; 4 | } 5 | 6 |

Error.

7 |

An error occurred while processing your request.

8 | 9 | @if (Model.ShowRequestId) 10 | { 11 |

12 | Request ID: @Model.RequestId 13 |

14 | } 15 | 16 |

Development Mode

17 |

18 | Swapping to Development environment will display more detailed information about the error that occurred. 19 |

20 |

21 | Development environment should not be enabled in deployed applications, as it can result in sensitive information from exceptions being displayed to end users. For local debugging, development environment can be enabled by setting the ASPNETCORE_ENVIRONMENT environment variable to Development, and restarting the application. 22 |

23 | -------------------------------------------------------------------------------- /TryVueMvcDecorator/Views/Shared/_Layout.cshtml: -------------------------------------------------------------------------------- 1 |  2 | 3 | 4 | 5 | 6 | @ViewData["Title"] - TryVueMvc 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 32 |
33 | @RenderBody() 34 |
35 |
36 |

© 2018 - Company

37 |
38 |
39 | 40 | 41 | 42 | 43 | 44 | 45 | @RenderSection("Scripts", required: false) 46 | 47 | 48 | -------------------------------------------------------------------------------- /TryVueMvcDecorator/Views/Shared/_ValidationScriptsPartial.cshtml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 12 | 18 | 19 | -------------------------------------------------------------------------------- /TryVueMvcDecorator/Views/_ViewImports.cshtml: -------------------------------------------------------------------------------- 1 | @using TryVueMvcDecorator 2 | @using TryVueMvcDecorator.Models 3 | @addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers 4 | -------------------------------------------------------------------------------- /TryVueMvcDecorator/Views/_ViewStart.cshtml: -------------------------------------------------------------------------------- 1 | @{ 2 | Layout = "_Layout"; 3 | } 4 | -------------------------------------------------------------------------------- /TryVueMvcDecorator/appsettings.Development.json: -------------------------------------------------------------------------------- 1 | { 2 | "Logging": { 3 | "IncludeScopes": false, 4 | "LogLevel": { 5 | "Default": "Debug", 6 | "System": "Information", 7 | "Microsoft": "Information" 8 | } 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /TryVueMvcDecorator/appsettings.json: -------------------------------------------------------------------------------- 1 | { 2 | "Logging": { 3 | "IncludeScopes": false, 4 | "LogLevel": { 5 | "Default": "Warning" 6 | } 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /TryVueMvcDecorator/bundleconfig.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "outputFileName": "wwwroot/dist/vendor1.js", 4 | "inputFiles": [ 5 | "node_modules/jquery/dist/jquery.js", 6 | "node_modules/popper.js/dist/umd/popper.js", 7 | "node_modules/bootstrap/dist/js/bootstrap.js", 8 | "node_modules/systemjs/dist/system.src.js" 9 | ], 10 | "minify": { 11 | "enabled": true, 12 | "renameLocals": true 13 | }, 14 | "sourceMap": true 15 | }, 16 | { 17 | "outputFileName": "wwwroot/dist/vendor1.css", 18 | "inputFiles": [ 19 | "node_modules/bootstrap/dist/css/bootstrap.css" 20 | ], 21 | "minify": { 22 | "enabled": false 23 | } 24 | }, 25 | { 26 | "outputFileName": "wwwroot/dist/vendor1.min.css", 27 | "inputFiles": [ 28 | "node_modules/bootstrap/dist/css/bootstrap.min.css" 29 | ], 30 | "minify": { 31 | "enabled": false 32 | } 33 | }, 34 | { 35 | "outputFileName": "wwwroot/vendor/vue.js", 36 | "inputFiles": [ 37 | "node_modules/vue/dist/vue.js" 38 | ], 39 | "minify": { 40 | "enabled": true, 41 | "renameLocals": true 42 | }, 43 | "sourceMap": true 44 | }, 45 | { 46 | "outputFileName": "wwwroot/vendor/vue-class-component.js", 47 | "inputFiles": [ 48 | "node_modules/vue-class-component/dist/vue-class-component.js" 49 | ], 50 | "minify": { 51 | "enabled": true, 52 | "renameLocals": true 53 | }, 54 | "sourceMap": true 55 | }, 56 | { 57 | "outputFileName": "wwwroot/dist/main.css", 58 | "inputFiles": [ 59 | "ClientApp/**/*.css" 60 | ], 61 | "minify": { 62 | "enabled": true 63 | } 64 | }, 65 | { 66 | "outputFileName": "wwwroot/dist/app-bandle.min.js", 67 | "inputFiles": [ 68 | "wwwroot/dist/app-bandle.js" 69 | ], 70 | "minify": { 71 | "enabled": true, 72 | "renameLocals": true 73 | } 74 | }, 75 | { 76 | "outputFileName": "wwwroot/dist/app-templates.html", 77 | "inputFiles": [ 78 | "ClientApp/**/*.html" 79 | ], 80 | "minify": { 81 | "enabled": false, 82 | "renameLocals": false 83 | } 84 | } 85 | ] -------------------------------------------------------------------------------- /TryVueMvcDecorator/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "version": "1.0.0", 3 | "name": "asp.net", 4 | "private": true, 5 | "dependencies": { 6 | "jquery": "^3.4.1", 7 | "popper.js": "^1.15.0", 8 | "bootstrap": "^4.3.1", 9 | "vue": "^2.6.10", 10 | "systemjs": "^0.21.6", 11 | "vue-class-component": "^7.1.0" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /TryVueMvcDecorator/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "removeComments": false, 4 | "sourceMap": true, 5 | "target": "es5", 6 | "module": "system", 7 | "outFile": "wwwroot/dist/app-bandle.js", 8 | "moduleResolution": "node", 9 | "esModuleInterop": true, 10 | "experimentalDecorators": true, 11 | //"noImplicitThis": true, 12 | //"noImplicitAny": true, 13 | //"alwaysStrict": true, 14 | //"strictNullChecks": true, 15 | //"strictFunctionTypes": true, 16 | //"strictPropertyInitialization": true, 17 | "strict": true, 18 | "noUnusedLocals": true, 19 | "noUnusedParameters": true, 20 | "noEmitOnError": true 21 | }, 22 | "include": [ 23 | "./ClientApp/**/*.ts" 24 | ] 25 | } 26 | -------------------------------------------------------------------------------- /TryVueMvcDecorator/wwwroot/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/schavelev/starter-vue-mvc/1147fddb29ca35e8a6003660535891c41b7e1375/TryVueMvcDecorator/wwwroot/favicon.ico -------------------------------------------------------------------------------- /TryVueMvcGrid/ClientApp/components/AppGrid.html: -------------------------------------------------------------------------------- 1 |  2 | 13 | -------------------------------------------------------------------------------- /TryVueMvcGrid/ClientApp/components/AppGrid.ts: -------------------------------------------------------------------------------- 1 | // ClientApp/components/AppGrid.ts 2 | import Vue from "vue"; 3 | import DemoGrid from "./DemoGrid"; 4 | 5 | export default Vue.extend({ 6 | template:'#app-grid-template', 7 | components: { 8 | DemoGrid 9 | }, 10 | data() { 11 | return { 12 | searchQuery: '', 13 | gridColumns: ['name', 'power'], 14 | gridRows: [ 15 | { name: 'Chuck Norris', power: Infinity }, 16 | { name: 'Bruce Lee', power: 9000 }, 17 | { name: 'Jackie Chan', power: 7000 }, 18 | { name: 'Jet Li', power: 8000 } 19 | ] 20 | } 21 | } 22 | }); -------------------------------------------------------------------------------- /TryVueMvcGrid/ClientApp/components/DemoGrid.html: -------------------------------------------------------------------------------- 1 |  2 | 24 | -------------------------------------------------------------------------------- /TryVueMvcGrid/ClientApp/components/DemoGrid.ts: -------------------------------------------------------------------------------- 1 | // ClientApp/components/DemoGrid.ts 2 | import Vue from "vue"; 3 | 4 | interface DemoGridProps { 5 | rows: Array; 6 | columns: Array; 7 | filterKey: string; 8 | } 9 | 10 | interface DemoGridData { 11 | sortKey: string; 12 | sortOrders: { [index: string]: number }; 13 | } 14 | 15 | export default Vue.extend({ 16 | template:'#demo-grid-template', 17 | props: ['rows', 'columns', 'filterKey'], 18 | data: function () { 19 | var data = { 20 | sortKey: '', 21 | sortOrders: {} 22 | } as DemoGridData; 23 | 24 | (this.$props as DemoGridProps).columns.forEach(function (key) { 25 | data.sortOrders[key] = 1 26 | }) 27 | return data; 28 | }, 29 | computed: { 30 | filteredData: function () { 31 | var thisData = (this.$data as DemoGridData); 32 | var thisProps = (this.$props as DemoGridProps); 33 | 34 | var sortKey = thisData.sortKey; 35 | var filterKey = thisProps.filterKey && thisProps.filterKey.toLowerCase(); 36 | var order = thisData.sortOrders[sortKey] || 1; 37 | var rows = thisProps.rows; 38 | if (filterKey) { 39 | rows = rows.filter(function (row) { 40 | return Object.keys(row).some(function (key) { 41 | return String(row[key]).toLowerCase().indexOf(filterKey) > -1 42 | }) 43 | }) 44 | } 45 | if (sortKey) { 46 | rows = rows.slice().sort(function (a, b) { 47 | a = a[sortKey] 48 | b = b[sortKey] 49 | return (a === b ? 0 : a > b ? 1 : -1) * order 50 | }) 51 | } 52 | return rows; 53 | } 54 | }, 55 | filters: { 56 | capitalize: function (str: string) { 57 | return str.charAt(0).toUpperCase() + str.slice(1) 58 | } 59 | }, 60 | methods: { 61 | sortBy: function (key: string) { 62 | var thisData = (this.$data as DemoGridData); 63 | thisData.sortKey = key 64 | thisData.sortOrders[key] = thisData.sortOrders[key] * -1 65 | } 66 | } 67 | }); -------------------------------------------------------------------------------- /TryVueMvcGrid/ClientApp/css/demo-grid.css: -------------------------------------------------------------------------------- 1 | /* ClientApp/css/demo-grid.css */ 2 | body { 3 | font-family: Helvetica Neue, Arial, sans-serif; 4 | font-size: 14px; 5 | color: #444; 6 | } 7 | 8 | table { 9 | border: 2px solid #42b983; 10 | border-radius: 3px; 11 | background-color: #fff; 12 | margin-top: .5rem; 13 | } 14 | 15 | th { 16 | background-color: #42b983; 17 | color: rgba(255,255,255,0.66); 18 | cursor: pointer; 19 | -webkit-user-select: none; 20 | -moz-user-select: none; 21 | -ms-user-select: none; 22 | user-select: none; 23 | } 24 | 25 | td { 26 | background-color: #f9f9f9; 27 | } 28 | 29 | th, td { 30 | min-width: 120px; 31 | padding: 10px 20px; 32 | } 33 | 34 | th.active { 35 | color: #fff; 36 | } 37 | 38 | th.active .arrow { 39 | opacity: 1; 40 | } 41 | 42 | .arrow { 43 | display: inline-block; 44 | vertical-align: middle; 45 | width: 0; 46 | height: 0; 47 | margin-left: 5px; 48 | opacity: 0.66; 49 | } 50 | 51 | .arrow.asc { 52 | border-left: 4px solid transparent; 53 | border-right: 4px solid transparent; 54 | border-bottom: 4px solid #fff; 55 | } 56 | 57 | .arrow.dsc { 58 | border-left: 4px solid transparent; 59 | border-right: 4px solid transparent; 60 | border-top: 4px solid #fff; 61 | } 62 | -------------------------------------------------------------------------------- /TryVueMvcGrid/ClientApp/css/site.css: -------------------------------------------------------------------------------- 1 | /* ClientApp/css/site.css */ 2 | body { 3 | margin: 5rem; 4 | background-color: honeydew; 5 | } -------------------------------------------------------------------------------- /TryVueMvcGrid/ClientApp/index.ts: -------------------------------------------------------------------------------- 1 | // ClientApp/index.ts 2 | import Vue from "vue"; 3 | import AppGrid from "./components/AppGrid"; 4 | 5 | let vueApp = new Vue({ 6 | el: "#app-root", 7 | render: h => h(AppGrid), 8 | components: { 9 | AppGrid 10 | } 11 | }); 12 | 13 | export default vueApp; -------------------------------------------------------------------------------- /TryVueMvcGrid/Controllers/HomeController.cs: -------------------------------------------------------------------------------- 1 | using System; 2 | using System.Collections.Generic; 3 | using System.Diagnostics; 4 | using System.Linq; 5 | using System.Threading.Tasks; 6 | using Microsoft.AspNetCore.Mvc; 7 | using TryVueMvcGrid.Models; 8 | 9 | namespace TryVueMvcGrid.Controllers 10 | { 11 | public class HomeController : Controller 12 | { 13 | public IActionResult Index() 14 | { 15 | return View(); 16 | } 17 | 18 | public IActionResult About() 19 | { 20 | ViewData["Message"] = "Your application description page."; 21 | 22 | return View(); 23 | } 24 | 25 | public IActionResult Contact() 26 | { 27 | ViewData["Message"] = "Your contact page."; 28 | 29 | return View(); 30 | } 31 | 32 | public IActionResult Error() 33 | { 34 | return View(new ErrorViewModel { RequestId = Activity.Current?.Id ?? HttpContext.TraceIdentifier }); 35 | } 36 | } 37 | } 38 | -------------------------------------------------------------------------------- /TryVueMvcGrid/Models/ErrorViewModel.cs: -------------------------------------------------------------------------------- 1 | using System; 2 | 3 | namespace TryVueMvcGrid.Models 4 | { 5 | public class ErrorViewModel 6 | { 7 | public string RequestId { get; set; } 8 | 9 | public bool ShowRequestId => !string.IsNullOrEmpty(RequestId); 10 | } 11 | } -------------------------------------------------------------------------------- /TryVueMvcGrid/Program.cs: -------------------------------------------------------------------------------- 1 | using System; 2 | using System.Collections.Generic; 3 | using System.IO; 4 | using System.Linq; 5 | using System.Threading.Tasks; 6 | using Microsoft.AspNetCore; 7 | using Microsoft.AspNetCore.Hosting; 8 | using Microsoft.Extensions.Configuration; 9 | using Microsoft.Extensions.Logging; 10 | 11 | namespace TryVueMvcGrid 12 | { 13 | public class Program 14 | { 15 | public static void Main(string[] args) 16 | { 17 | CreateWebHostBuilder(args).Build().Run(); 18 | } 19 | 20 | public static IWebHostBuilder CreateWebHostBuilder(string[] args) => 21 | WebHost.CreateDefaultBuilder(args) 22 | .UseStartup(); 23 | } 24 | } 25 | -------------------------------------------------------------------------------- /TryVueMvcGrid/Properties/launchSettings.json: -------------------------------------------------------------------------------- 1 | { 2 | "iisSettings": { 3 | "windowsAuthentication": false, 4 | "anonymousAuthentication": true, 5 | "iisExpress": { 6 | "applicationUrl": "http://localhost:51767", 7 | "sslPort": 0 8 | } 9 | }, 10 | "profiles": { 11 | "IIS Express": { 12 | "commandName": "IISExpress", 13 | "launchBrowser": true, 14 | "environmentVariables": { 15 | "ASPNETCORE_ENVIRONMENT": "Development" 16 | } 17 | }, 18 | "TryVueMvcGrid": { 19 | "commandName": "Project", 20 | "launchBrowser": true, 21 | "environmentVariables": { 22 | "ASPNETCORE_ENVIRONMENT": "Development" 23 | }, 24 | "applicationUrl": "http://localhost:5000" 25 | } 26 | } 27 | } 28 | -------------------------------------------------------------------------------- /TryVueMvcGrid/Startup.cs: -------------------------------------------------------------------------------- 1 | using System; 2 | using System.Collections.Generic; 3 | using System.Linq; 4 | using System.Threading.Tasks; 5 | using Microsoft.AspNetCore.Builder; 6 | using Microsoft.AspNetCore.Hosting; 7 | using Microsoft.AspNetCore.Http; 8 | using Microsoft.AspNetCore.Mvc; 9 | using Microsoft.Extensions.Configuration; 10 | using Microsoft.Extensions.DependencyInjection; 11 | 12 | namespace TryVueMvcGrid 13 | { 14 | public class Startup 15 | { 16 | public Startup(IConfiguration configuration) 17 | { 18 | Configuration = configuration; 19 | } 20 | 21 | public IConfiguration Configuration { get; } 22 | 23 | // This method gets called by the runtime. Use this method to add services to the container. 24 | public void ConfigureServices(IServiceCollection services) 25 | { 26 | services.AddMvc().SetCompatibilityVersion(CompatibilityVersion.Version_2_2); 27 | } 28 | 29 | // This method gets called by the runtime. Use this method to configure the HTTP request pipeline. 30 | public void Configure(IApplicationBuilder app, IHostingEnvironment env) 31 | { 32 | if (env.IsDevelopment()) 33 | { 34 | app.UseDeveloperExceptionPage(); 35 | } 36 | else 37 | { 38 | app.UseExceptionHandler("/Home/Error"); 39 | } 40 | 41 | app.UseStaticFiles(); 42 | 43 | app.UseMvc(routes => 44 | { 45 | routes.MapRoute( 46 | name: "default", 47 | template: "{controller=Home}/{action=Index}/{id?}"); 48 | }); 49 | } 50 | } 51 | } 52 | -------------------------------------------------------------------------------- /TryVueMvcGrid/TryVueMvcGrid.csproj: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | netcoreapp2.2 5 | InProcess 6 | Latest 7 | 8 | 9 | 10 | 11 | 12 | 13 | all 14 | runtime; build; native; contentfiles; analyzers 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | -------------------------------------------------------------------------------- /TryVueMvcGrid/Views/Home/About.cshtml: -------------------------------------------------------------------------------- 1 | @{ 2 | ViewData["Title"] = "About"; 3 | } 4 |

@ViewData["Title"]

5 |

@ViewData["Message"]

6 | 7 |

Use this area to provide additional information.

8 | -------------------------------------------------------------------------------- /TryVueMvcGrid/Views/Home/Contact.cshtml: -------------------------------------------------------------------------------- 1 | @{ 2 | ViewData["Title"] = "Contact"; 3 | } 4 |

@ViewData["Title"]

5 |

@ViewData["Message"]

6 | 7 |
8 | One Microsoft Way
9 | Redmond, WA 98052-6399
10 | P: 11 | 425.555.0100 12 |
13 | 14 |
15 | Support: Support@example.com
16 | Marketing: Marketing@example.com 17 |
18 | -------------------------------------------------------------------------------- /TryVueMvcGrid/Views/Home/Index.cshtml: -------------------------------------------------------------------------------- 1 | @* Views/Home/Index.cshtml *@ 2 | @using Microsoft.AspNetCore.Hosting 3 | @inject IHostingEnvironment hostingEnv 4 | @{ 5 | var vueUrl = hostingEnv.IsDevelopment() ? "/dist/vendor2.js" : "/dist/vendor2.min.js"; 6 | var mainUrl = hostingEnv.IsDevelopment() ? "/dist/app-bandle.js" : "/dist/app-bandle.min.js"; 7 | 8 | ViewData["Title"] = "TryVueMvc Sample"; 9 | } 10 |
11 |
loading..
12 | @section Scripts{ 13 | 20 | 21 | 30 | } 31 | -------------------------------------------------------------------------------- /TryVueMvcGrid/Views/Shared/Error.cshtml: -------------------------------------------------------------------------------- 1 | @model ErrorViewModel 2 | @{ 3 | ViewData["Title"] = "Error"; 4 | } 5 | 6 |

Error.

7 |

An error occurred while processing your request.

8 | 9 | @if (Model.ShowRequestId) 10 | { 11 |

12 | Request ID: @Model.RequestId 13 |

14 | } 15 | 16 |

Development Mode

17 |

18 | Swapping to Development environment will display more detailed information about the error that occurred. 19 |

20 |

21 | Development environment should not be enabled in deployed applications, as it can result in sensitive information from exceptions being displayed to end users. For local debugging, development environment can be enabled by setting the ASPNETCORE_ENVIRONMENT environment variable to Development, and restarting the application. 22 |

23 | -------------------------------------------------------------------------------- /TryVueMvcGrid/Views/Shared/_Layout.cshtml: -------------------------------------------------------------------------------- 1 |  2 | 3 | 4 | 5 | 6 | @ViewData["Title"] - TryVueMvc 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 32 |
33 | @RenderBody() 34 |
35 |
36 |

© 2018 - Company

37 |
38 |
39 | 40 | 41 | 42 | 43 | 44 | 45 | @RenderSection("Scripts", required: false) 46 | 47 | 48 | -------------------------------------------------------------------------------- /TryVueMvcGrid/Views/Shared/_ValidationScriptsPartial.cshtml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 12 | 18 | 19 | -------------------------------------------------------------------------------- /TryVueMvcGrid/Views/_ViewImports.cshtml: -------------------------------------------------------------------------------- 1 | @using TryVueMvcGrid 2 | @using TryVueMvcGrid.Models 3 | @addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers 4 | -------------------------------------------------------------------------------- /TryVueMvcGrid/Views/_ViewStart.cshtml: -------------------------------------------------------------------------------- 1 | @{ 2 | Layout = "_Layout"; 3 | } 4 | -------------------------------------------------------------------------------- /TryVueMvcGrid/appsettings.Development.json: -------------------------------------------------------------------------------- 1 | { 2 | "Logging": { 3 | "IncludeScopes": false, 4 | "LogLevel": { 5 | "Default": "Debug", 6 | "System": "Information", 7 | "Microsoft": "Information" 8 | } 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /TryVueMvcGrid/appsettings.json: -------------------------------------------------------------------------------- 1 | { 2 | "Logging": { 3 | "IncludeScopes": false, 4 | "LogLevel": { 5 | "Default": "Warning" 6 | } 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /TryVueMvcGrid/bundleconfig.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "outputFileName": "wwwroot/dist/vendor1.js", 4 | "inputFiles": [ 5 | "node_modules/jquery/dist/jquery.js", 6 | "node_modules/popper.js/dist/umd/popper.js", 7 | "node_modules/bootstrap/dist/js/bootstrap.js", 8 | "node_modules/systemjs/dist/system.js", 9 | "node_modules/systemjs/dist/extras/named-register.js" 10 | ], 11 | "minify": { 12 | "enabled": true, 13 | "renameLocals": true 14 | }, 15 | "sourceMap": true 16 | }, 17 | { 18 | "outputFileName": "wwwroot/dist/vendor1.css", 19 | "inputFiles": [ 20 | "node_modules/bootstrap/dist/css/bootstrap.css" 21 | ], 22 | "minify": { 23 | "enabled": false 24 | } 25 | }, 26 | { 27 | "outputFileName": "wwwroot/dist/vendor1.min.css", 28 | "inputFiles": [ 29 | "node_modules/bootstrap/dist/css/bootstrap.min.css" 30 | ], 31 | "minify": { 32 | "enabled": false 33 | } 34 | }, 35 | { 36 | "outputFileName": "wwwroot/dist/vendor2.js", 37 | "inputFiles": [ 38 | "node_modules/vue/dist/vue.js" 39 | ], 40 | "minify": { 41 | "enabled": true, 42 | "renameLocals": true 43 | }, 44 | "sourceMap": true 45 | }, 46 | { 47 | "outputFileName": "wwwroot/dist/main.css", 48 | "inputFiles": [ 49 | "ClientApp/**/*.css" 50 | ], 51 | "minify": { 52 | "enabled": true 53 | } 54 | }, 55 | { 56 | "outputFileName": "wwwroot/dist/app-bandle.min.js", 57 | "inputFiles": [ 58 | "wwwroot/dist/app-bandle.js" 59 | ], 60 | "minify": { 61 | "enabled": true, 62 | "renameLocals": true 63 | } 64 | }, 65 | { 66 | "outputFileName": "wwwroot/dist/app-templates.html", 67 | "inputFiles": [ 68 | "ClientApp/**/*.html" 69 | ], 70 | "minify": { 71 | "enabled": false, 72 | "renameLocals": false 73 | } 74 | } 75 | ] 76 | 77 | -------------------------------------------------------------------------------- /TryVueMvcGrid/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "version": "1.0.0", 3 | "name": "asp.net", 4 | "private": true, 5 | "dependencies": { 6 | "jquery": "^3.4.1", 7 | "popper.js": "^1.15.0", 8 | "bootstrap": "^4.3.1", 9 | "vue": "^2.6.10", 10 | "systemjs": "^3.1.6" 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /TryVueMvcGrid/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "removeComments": false, 4 | "sourceMap": true, 5 | "target": "es5", 6 | "module": "system", 7 | "outFile": "wwwroot/dist/app-bandle.js", 8 | "moduleResolution": "node", 9 | "esModuleInterop": true, 10 | //"noImplicitThis": true, 11 | //"noImplicitAny": true, 12 | //"alwaysStrict": true, 13 | //"strictNullChecks": true, 14 | //"strictFunctionTypes": true, 15 | //"strictPropertyInitialization": true, 16 | "strict": true, 17 | "noUnusedLocals": true, 18 | "noUnusedParameters": true, 19 | "noEmitOnError": true 20 | }, 21 | "include": [ 22 | "./ClientApp/**/*.ts" 23 | ] 24 | } 25 | -------------------------------------------------------------------------------- /TryVueMvcGrid/wwwroot/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/schavelev/starter-vue-mvc/1147fddb29ca35e8a6003660535891c41b7e1375/TryVueMvcGrid/wwwroot/favicon.ico -------------------------------------------------------------------------------- /vue+aspnet+ts-bootstrap+require.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/schavelev/starter-vue-mvc/1147fddb29ca35e8a6003660535891c41b7e1375/vue+aspnet+ts-bootstrap+require.png --------------------------------------------------------------------------------