WebStorm 内置 Web 服务器为每个 css 和 index.html 中包含的 js 文件获取 404

Question

为了后代，这是我的index.html：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
    <meta name="description" content="">
    <meta name="author" content="">
    <base href="/" />
    <title>Cart</title>
    <link href="content/external/bootstrap.css" rel="stylesheet" />
    <link href="content/external/bootstrap-theme.css" rel="stylesheet" />
    <link href="content/external/font-awesome.css" rel="stylesheet" />
    <link href="content/external/angular-toastr.css" rel="stylesheet" />
</head>
<body ng-app>

{{3+4}}

drfg



<script src="scripts/external/jquery-1.9.1.js"></script>
<script src="scripts/external/bootstrap.js"></script>
<script src="scripts/external/angular.js"></script>
<script src="scripts/external/angular-ui-router.js"></script>
<script src="scripts/external/angular-resource.js"></script>
<script src="scripts/external/angular-mocks.js"></script>
<script src="scripts/external/angular-toastr.tpls.js"></script>
<script src="scripts/external/angular-animate.js"></script>


</body>
</html>

每当我在 webstorm 中点击运行以在 chrome 中打开时，每个 javascript 和 css 文件都会收到 404。但是，如果我将范围限定到项目目录和运行节点的 http-server，我的站点加载就很好了。我似乎无法在与此相关的设置中找到任何内容。有任何想法吗？

Answer 1

问题是由 index.html 中的标签引起的：

<base href="/"/>

告诉浏览器解析页面中相对于网络服务器根目录的所有 URL（localhost:63342 使用内置网络服务器时）。显然在那里找不到资源，因为内置网络服务器提供来自 http://localhost:63342/<project root> 的文件因此，您需要注释掉“<base href="/"/>”以使您的代码正常工作。或者，修改您的主机文件以使网络服务器提供来自 http://<some name>:63342 的文件 - 请参阅 http://youtrack.jetbrains.com/issue/WEB-8988#comment=27-577559

WebStorm 内置 Web 服务器为每个 css 和 index.html 中包含的 js 文件获取 404

WebStorm built-in web server gets 404 for every css and js file included in index.html

html

javascript

css

webstorm

server