如何解决如何在Visual Studio中为Vue + webpack + asp.net核心启用js热重加载?
许多小时后,我设法在Visual Studio中设置了最少(希望如此)的Vue + Webpack + ASP.NET Core / Razor应用程序,并且我使单个文件Vue组件正常工作(如果有人想尝试-这是GitHub存储库:{{ 3}})。
如何启用JS / Vue内容的热重加载?
我想尽可能保留Visual Studio Razor Pages调试功能。
我以前从未使用过webpack,并且我对这个生态系统不熟悉。
这是我的package.json:
{
"name": "razorvue","version": "1.0.0","description": "","main": "site.js","scripts": {
"build": "webpack"
},"repository": {
"type": "git","url": "razorvue"
},"author": "","license": "","dependencies": {
"vue": "^2.6.12"
},"devDependencies": {
"babel-core": "^6.26.3","babel-loader": "^7.1.5","babel-polyfill": "^6.26.0","babel-preset-env": "^1.7.0","vue-loader": "^15.9.4","vue-template-compiler": "^2.6.12","webpack": "^5.3.0","webpack-cli": "^4.1.0"
}
}
这是我的webpack.config.js
const path = require('path');
const VueLoaderPlugin = require('vue-loader/lib/plugin')
module.exports = {
entry: ['./src/js/main.js'],output: {
path: path.resolve(__dirname,'./wwwroot/js'),filename: 'bundle.js'
},// IMPORTANT NOTE: If you are using Webpack 2 or above,replace "loaders" with "rules"
module: {
rules: [{
loader: 'babel-loader',test: /\.js$/,exclude: /node_modules/
},{
test: /\.vue$/,loader: 'vue-loader'
}
]
},plugins: [
// make sure to include the plugin!
new VueLoaderPlugin()
]
}
在开始调试(或构建解决方案)之前,我已将“构建前事件命令行设置为运行npm run build
:
我的项目结构如下:
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。