使用 Microsoft WebApi 2 和 SPA Vue2 进行热重载

Question

前端：VueJs2 (vue-cli webpack) 作为 SPA

后端：Microsoft WebApi 2

我无法在项目上设置热重载，因为热重载在定义的端口上启动节点服务器，而我的 WebApi 在不同的端口上 => 跨域错误。（和我无法在 IIS 中禁用跨域）

我知道 Asp.Net 核心有 NodeServices 包（Nuget 和 npm）来启用热重载。

WebApi 2 是否有类似的解决方法？

Answer 1

您可以通过在 webpack 配置中添加代理来使其工作。 (vue-cli webpack 配置)

config/index.js

dev: {
env: require('./dev.env'),
port: 52286,
autoOpenBrowser: true,
assetsSubDirectory: 'static',
assetsPublicPath: '/',
proxyTable: {
  '/someExamples': {
    target: 'http://localhost',
    changeOrigin: true,
  },
...
},

build/dev-server.js

var uri = 'http://localhost:' + port + '<path to home>'

var _resolve
var readyPromise = new Promise(resolve => {
  _resolve = resolve
})

console.log('> Starting dev server...')
devMiddleware.waitUntilValid(() => {
  console.log('> Listening at ' + uri + '\n')
  // when env is testing, don't need open it
  if (autoOpenBrowser && process.env.NODE_ENV !== 'testing') {
    opn(uri)
  }
  _resolve()
})

向 http://localhost:52286/someExamples will be redirected to http://localhost/someExamples 发出的任何请求，可以是本地网站。

使用 Microsoft WebApi 2 和 SPA Vue2 进行热重载

Hot Reload with Microsoft WebApi 2 and SPA Vue2

c#

asp.net-web-api

webpack-2

vuejs2

vue-cli