Asp.net core 将vue js与asp.net core 2.1集成

有人能帮我解释一下如何将vue.js与asp.net core 2.1结合使用吗。 理想情况下，我只想在visual studio 2017中点击f5并加载网站

---

我知道ms以前有spa模板，但它们似乎已经被放弃了。github上也有一个初学者模板，但它使用的是.NETCore2.0

目前，我正在尝试将Vue.js与MVC Core 2.1一起用于多页面应用程序，并找到了一个可行的解决方案
我看到你提到SPA，我的答案是多页面应用，但其中一些想法可能适用

我的方法 我在

wwwroot/resources/js/

中创建了一个

main.js

文件，在该目录中创建了一个

components

子文件夹，在components-one中还创建了一个

layout

文件夹。

在

main.js

中，我创建了一个Vue实例，并将其附加到HTML中的#app root元素。在这个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"
});

在

\u layout.cshtml

文件中，我有以下内容（相关内容）：

#视图/Shared/_Layout.cshtml
@RenderBody（）

如果您只对SPA感兴趣，我可能会做以下事情：

#wwwroot/resources/js/main.js
从“Vue”导入Vue；
从“/App.vue”导入应用程序；
新Vue({
el:“应用程序”，
渲染：（h）=>h（应用程序）
});
#wwwroot/resources/js/App.vue
导出默认值{
名称：“应用程序”，
数据：函数（）{
返回{
//什么电动汽车
}
}
}

如果您正在构建一个多页应用程序，可以将此模板作为示例或起点

如果你正在构建一个SPA，考虑将API从UI中分割出来并用于UI部分。

< P> VueJs（连同角和Recjs）在新项目的一个阶段是可用的，但后来由于维护人员有限而被删除。但是，您仍然可以通过命令行创建VueJs应用程序。运行

dotnet new-l

查看可用的dotnet模板列表

如果在列表中未看到VUEJ，请安装模板

dotnet新建--安装Microsoft.AspNetCore.spattemplates:：*

一旦你创建了web应用程序，并在VS中打开它，你应该能够像其他项目一样运行它，只需点击F5

网上有一些很好的资源：

第二个链接提到vuejs模板仍然可以通过命令行使用

我还发现本系列内容非常丰富，介绍了从设置到部署的过程

---

请参见和。为什么投票否决了这一点？准确地回答了问题的内容。

# 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>