捆绑后的预包和包裹路由问题
一个多月以来，我一直在寻求解决这个问题的办法。
我使用parcel-bundler和preact构建了一个个人登陆页面。我还使用preact-router来处理我的路由。
这是一些密码。
主应用程序组件
class App extends Component {
render(props) {
return (
<div id='main'>
{/* Components outside of router persist
throughout all pages */}
<Header />
<Nav tabs={tabs} />
<Router>
<About default path='/about' />
<Skills path='/skills' />
<Books path='/books' />
</Router>
</div>
)
}
}Nav组分
const Nav = ({ tabs }) =>
<nav>
{tabs.map(t => (
<p>
<Link activeClassName='active' href={ t.path }>{ t.title.toUpperCase() }</Link>
</p>
))}
</nav>tabs.json
[
{
"title": "About",
"path": "/about"
},
{
"title": "Skills",
"path": "/skills"
},
{
"title": "Books",
"path": "/books"
}
]因此，每当我使用page的服务器实时运行页面时，一切都按预期运行:我单击一个选项卡，相应的页面/组件就会呈现出来。
但是，，每当我运行parcel build blah blah时，打开 index.html并单击任意选项卡，就会得到以下https://i.imgur.com/71ogrFA.png (单击选项卡时浏览器窗口的屏幕快照)，浏览器的URL条将更改为file:///C:/{route_name}。
我试图理解为什么我的页面在包裹的实时服务器上运行时会正常工作，为什么在构建后它不能工作呢？看起来，在构建之后，单击任何选项卡会导致浏览器搜索文件系统中的页面吗？是那个案子吗？最终，我怎样才能解决这个问题？
回答 1
Stack Overflow用户
发布于 2018-05-29 08:48:38
URL中的前导斜杠使它们对根目录是绝对的。
如果站点是通过HTTP传输的，则根目录是域:放置在具有http://example.com/foo/bar URL的站点上的http://example.com/foo/bar将指向http://example.com/bar。
但是，在浏览器中从PC打开文件时使用的文件协议中，根是当前驱动器的根文件夹，通常是C:。因此，如果您在本地file:///C:/some/path/foo/bar上打开相同的文件，则链接将指向file:///C:/bar。
最重要的是，这意味着这一错误只存在于地方发展过程中。一旦您的站点托管在实际服务器上，就不会发生这种情况。
您可以使用像XAMPP或MAMP这样的工具运行本地HTTP服务器，以确保链接在部署前工作。
包裹开发服务器也在运行本地HTTP服务器，这就是为什么链接在那里运行良好的原因。
https://stackoverflow.com/questions/50532017
复制
相似问题
android -在活动中显示数据的最佳存储实践
在android中显示gif
在android中显示gif
在android上显示嵌套列表的最佳实践
android :在android中显示gif图片
领取专属 10元无门槛券
AI混元助手 在线答疑
洞察 腾讯核心技术
剖析业界实践案例
腾讯云开发者
