Интегрировать vue js с asp.net core 2.1

В настоящий момент я пытаюсь использовать Vue.js с MVC Core 2.1 для многостраничного приложения и нашел рабочее решение.
Я вижу, что вы упомянули SPA, мой ответ будет для многостраничных приложений, но некоторые идеи могут быть применимы.

Мой подход

Я создал файл main.js в wwwroot/resources/js/ и подпапку components в этом каталоге, а также папку layout в одном компоненте.

В main.js я создаю экземпляр Vue и прикрепляю его к корневому элементу #app в HTML. В этом js-файле я также регистрирую большинство компонентов глобально, если они не нужны только для определенных компонентов. Мой main.js выглядит примерно так:

# wwwroot/resources/js/main.js

import Vue from 'vue';
import Axios from 'axios';
import BaseLayout from './components/layout/BaseLayout.vue';

window.axios = Axios;

Vue.component("base-layout", BaseLayout);
new Vue({
    el: "#App"
});

В файле _layout.cshtml у меня есть следующее (соответствующее содержание):

# Views/Shared/_Layout.cshtml
<div id = "App">
    <base-layout>
        @RenderBody()
    </base-layout>
</div>

<script src = "~/resources/js/bundle.js"></script>

Если вас интересует только СПА - я, наверное, сделал бы что-то вроде:

# wwwroot/resources/js/main.js

import Vue from 'vue';
import App from './App.vue';
new Vue({
    el: "#app",
    render: (h) => h(App)
});

# wwwroot/resources/js/App.vue

<template>
    <div id = "app">
         <-- Use other components here -->
    </div>
</template>

<script>
    export default {
        name: "app",
        data: function() {
            return {
                // What evs
            }
        }
    }
</script>

Если вы создаете многостраничное приложение, вы можете взглянуть на этот шаблон в качестве примера или отправной точки.

https://github.com/danijelh/aspnetcore-vue-typescript-template

Если вы создаете SPA, подумайте о том, чтобы отделить API от пользовательского интерфейса и использовать Vue CLI 3 для части пользовательского интерфейса.

VueJs (вместе с Angular и ReactJs) был доступен на одном этапе из нового проекта, но был удален позже из-за ограниченного числа сопровождающих. Однако вы все равно можете создать приложение VueJs через командную строку. Запустите dotnet new -l, чтобы увидеть список доступных шаблонов dotnet.

если вы не видите vuejs в списке, установите шаблоны

dotnet new --install Microsoft.AspNetCore.SpaTemplates::*

После того, как вы создадите веб-приложение и откроете его в VS, вы сможете запустить его, как любой другой проект, нажав F5.

В Интернете есть несколько хороших ресурсов:

Asp.NETCore 2.1 Vue 2 Starter - от DevHelp.Online

Создание VueJS (с TypeScript) SPA в ASP.Net Core 2.1

Во второй ссылке упоминается, что шаблон vuejs по-прежнему доступен через командную строку.

Также я нашел эту серию очень информативной, объясняет от настройки до развертывания.

https://code-maze.com/net-core-series/