更新

Question

我正在使用Angular2-seed开发一个应用程序。我正在尝试进行静态演示，但找不到一些资源。

npm run build.dev在项目目录中创建以下文件：

的index.html ：

<!DOCTYPE html>
<html lang="en">
<head>

<base href="/">
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Dashboard</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">

<!-- inject:css -->
<link rel="stylesheet" href="/node_modules/bootstrap/dist/css/bootstrap.css?1474900046924">
<link rel="stylesheet" href="/dist/dev/css/main.css?1474900046926">
<!-- More css... -->
<!-- endinject -->

<sd-app>Loading...</sd-app>

<script>
// Fixes undefined module function in SystemJS bundle
function module() {}
</script>

<script src="/app/system-config.js"></script>

<!-- libs:js -->
<script src="/node_modules/zone.js/dist/zone.js?1474900046920"></script>
<!-- More libs... -->
<!-- endinject -->

<script>
System.import('app/main')
  .catch(function (e) {
    console.error(e,
      'Report this error at https://github.com/mgechev/angular2-seed/issues');
  });
</script>

我收到以下错误消息：

Failed to load resource: net::ERR_FILE_NOT_FOUND file:///node_modules/bootstrap/dist/css/bootstrap.css?1474900046924
Failed to load resource: net::ERR_FILE_NOT_FOUND file:///dist/dev/css/main.css?1474900046926
Failed to load resource: net::ERR_FILE_NOT_FOUND file:///app/system-config.js
Uncaught ReferenceError: System is not defined

因此，由于浏览器试图在根目录中找到它们，因此找不到资源。

但是，如果我改变了这个：

<link rel="stylesheet" href="/dist/dev/css/main.css?1474900046926">

对此：

<link rel="stylesheet" href="./css/main.css?1474900046926">

仅适用于：

<link rel="stylesheet" href="/<absolute-path>/dist/dev/css/main.css?1474900046926">

但这真令人讨厌，而System尚未找到。

知道怎么做吗？

更新

我已经使用project.config.ts文件注入了css资产和js库：

// Add `NPM` third-party libraries to be injected/bundled.
this.NPM_DEPENDENCIES = [
  ...this.NPM_DEPENDENCIES,
  { src: 'bootstrap/dist/css/bootstrap.css', inject: true},
  // More css and js files
];

Answer 1

不要像这样直接链接到你的CSS。而是使用project.config文件在index.html中注入CSS。在＆＃34; tools / config＆＃34;下查找此文件。文件夹中。

请参阅：https://github.com/mgechev/angular2-seed/wiki/Add-external-scripts-and-styles

Answer 2

您不应直接在index.html中注入项目中的css文件。 Main.css由种子注入，引导程序css应通过project.config.ts添加。请参阅：https://github.com/mgechev/angular2-seed/wiki/Add-external-scripts-and-styles

从Angular 2种子项目生成静态文件

更新

2 个答案: