更新:
原来它是Windows上Vue webpack模板中的一个bug,很快就会修复
问题:
我用vue init webpack projectName安装了一个新的Vue项目,现在我在刷新页面时得到了:Cannot GET /path (在本地主机上)。
例如,如果我去/contact,我会看到页面的内容,但是一旦我点击刷新,我就得到了Cannot GET /contact
更重要的是,您现在不能简单地手动在地址栏中键入路由,您将得到相同的错误。
mode: 'history'npm run dev)上看到了这个几天前它确实正常工作了。我现在该怎么做?
互联网上的所有答案都是没用的(也许我没有正确地应用它们)
index.js
import Vue from 'vue'
import Router from 'vue-router'
import Vuetify from 'vuetify'
import 'vuetify/dist/vuetify.min.css'
import Home from '@/components/Home'
import Contact from '@/components/Contact'
Vue.use(Router)
Vue.use(Vuetify)
export default new Router({
mode: 'history',
routes: [
{
path: '/',
name: 'Home',
component: Home
},
{
path: '/contact',
name: 'Contact',
component: Contact
}
]
})正因为如此,我现在也不能做这种重定向的工作了:
{
path: '*',
redirect: '/'
}我也会犯同样的错误。
所以我想这可能是Webpack的模板错误,我注意到webpack.dev.conf.js现在有点不同,现在有这样的线条:
devServer: {
clientLogLevel: 'warning',
historyApiFallback: {
rewrites: [
{ from: /.*/, to: path.join(config.dev.assetsPublicPath, 'index.html') },
],
},
[...]我想这和这件事有关。
发布于 2020-11-22 18:40:43
我在vue路由器历史模式和webpack开发服务器上挣扎了一段时间。原来我在vue路由器定义中缺少了"base“属性:
const router = new VueRouter({
mode: 'history',
base: "/user",
routes: [ ... ]
});我的webpack配置如下:
devServer: {
...
historyApiFallback: {
rewrites: [
{ from: /^\/user/, to: '/user.html' }
]
}
}所以现在,当我转到http://mylocaldev.com/user或http://mylocaldev.com/user/whatever时,它的工作原理与生产一样。
https://stackoverflow.com/questions/48123503
复制相似问题