Angular 4 中的生产构建后日期选择器样式不起作用

Question

最近我创建了一个 Angular5 应用程序构建，其中我使用 ngx-bootstrap 来显示日期选择器和模态。它在生产前运行良好，但在生产后，build 似乎失去了它的样式。

请检查附件...

我再次按照所有实施步骤操作，但没有任何效果。

请帮忙解决这个问题。太感谢了。

Answer 1

终于找到解决方法了

我刚刚将 ngx-bootstrap CSS 添加到 angular-cli.json

angular-cli.json

"styles": [
    "styles.css",
    "../node_modules/ngx-bootstrap/datepicker/bs-datepicker.css"],

它对我有用。感谢关注。

Answer 2

另一个解决方案是将 CSS 添加到您的资产目录。

Answer 3

如果以前的解决方案不能解决您的问题，则其他解决方案可以解决您的问题：

适用于：

"@angular/core": "^6.0.3", "@angular/material": "^7.3.2",

首先在样式路径中将 bs-datepicker.css 路径添加到 angular.json 文件：

"styles": [
    "styles.css",
    "../node_modules/ngx-bootstrap/datepicker/bs-datepicker.css"],

如果您添加 bs-datepicker.css 但仍然不起作用，请尝试将此 link 添加到您的 style.css

@import "~node_modules/ngx-bootstrap/datepicker/bs-datepicker.css";

解决了我的问题希望对你有帮助！

Answer 4

对于 Angular 10 和 ngx 版本 6.2.0

当我们使用 npm install ngx-bootstrap --save 这个命令。

试试用这个 ng add ngx-bootstrap

但如果您使用了第一个命令，请在此之前使用 npm uninstall。

Answer 5

@import '../node_modules/bootstrap/scss/bootstrap';
@import "../node_modules/ngx-bootstrap/datepicker/bs-datepicker";

在src/styles.scss

中添加以上内容

Date-picker styles not working after production build in Angular 4