Angular 5: css не появляется и не может перейти на другие страницы после ng build --prod - PullRequest
Новая
       1

Angular 5: css не появляется и не может перейти на другие страницы после ng build --prod

0 голосов
/ 02 мая 2018

После запуска команды ng build -- prod в терминале css не появляется и не может просматривать другие страницы, кроме индекса. Index.html под dist выглядит следующим образом: 

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>ShoptoMyDoor</title>
  <base href="/">

  <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">

  <link rel="icon" type="image/x-icon" href="favicon.ico">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  <!-- <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous"> -->
 <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
        <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
        <!--[if lt IE 9]>
          <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
          <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
          <![endif]-->

  
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic">
  
</head>
<body class="hold-transition skin-black-light sidebar-mini">

Мой файл .angular-cli.json выглядит так (частично вставлен сюда, при необходимости будет публиковать полное содержимое файла): 

   {
  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
  "project": {
    "name": "angular"
  },
  "apps": [
    {
      "root": "src",
      "outDir": "dist",
      "assets": [
        "assets",
        "favicon.ico"
      ],
      "index": "index.html",
      "main": "main.ts",
      "polyfills": "polyfills.ts",
      "test": "test.ts",
      "tsconfig": "tsconfig.app.json",
      "testTsconfig": "tsconfig.spec.json",
      "prefix": "app",
      "styles": [
        "styles.scss",
        "assets/css/bootstrap.min.css",
        "assets/css/font-awesome.min.css",
        "assets/css/ionicons.min.css",
        "assets/css/theme.min.css",
        "assets/css/all-skins.min.css",
        "assets/css/morris.css",
        "assets/css/jquery-jvectormap.css",
        "assets/css/bootstrap-datepicker.min.css",
        "assets/css/daterangepicker.css",
        "assets/css/bootstrap3-wysihtml5.min.css",
        "assets/css/style.css"],

Когда я пытаюсь просмотреть то же самое, набрав "http://localhost/ngAngular/dist/", там нет css и js. Кроме того, когда я пытался получить доступ к пути, например" http://localhost/ngAngular/dist/admin/book" или "http://localhost/ngAngular/dist/admin/product", показывает ошибку 404 Not Found.

Обновленная версия 1:

My app-routing.ts в разделе src / app /: 

const appRoutes: Routes = [
  {path: 'login', component: LoginComponent},
  {path: 'admin/login', component: AdminLoginComponent},
  {path: '', redirectTo: '/login', pathMatch: 'full'},
  {path: 'register', component: RegisterComponent},
  {path: '**', component: PageNotFoundComponent}
];

В папке / admin /, мой admin-routing.module.ts находится ниже: 

const adminRoutes: Routes = [
  {
    path: 'admin',
    component: AdminComponent,
    canActivate: [AuthGuardService],
    children: [
      {
        path: '',
        canActivateChild: [AuthGuardService],
        children: [
          {path: 'book', component: BookComponent},
          {path: 'product', component: ProductComponent},
          {path: 'addbook', component: AddbookComponent},
          {path: '', component: AdminDashboardComponent},
          {path: 'update-product/:id', component: UpdateProductComponent}
        ],
      }
    ]
  }
];

1 Ответ

0 голосов
/ 02 мая 2018

попробуйте использовать относительный путь для базы 

<base href="./">
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...