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

【问题标题】：Date-picker styles not working after production build in Angular 4在Angular 4中构建生产后日期选择器样式不起作用
【发布时间】：2018-04-17 15:40:42
【问题描述】：

最近我创建了我的 Angular5 应用程序的构建，其中我使用 ngx-bootstrap 来显示日期选择器和模式。它在生产之前工作得很好，但是在生产之后，构建似乎失去了它的样式。

请检查附件...

我再次执行了所有实施步骤，但没有任何效果。

请帮助解决此问题。太感谢了。

【问题讨论】：

您是否尝试在您的开发和产品站点上使用 Chrome 检查器来查看两个站点之间的标记或样式是否存在差异？您是否查看了 package-lock.json 文件以查看它们是否使用完全相同的版本？
嗨，Daniel，我几乎做了所有事情来实现它，终于找到了最初加载 css 的解决方案。顺便说一句，感谢您的关注和帮助 :)
这是因为，ngx-bootstrap提供的datepicker和bootstrap提供的不一样，所以需要额外的样式。

【解决方案1】：

终于找到了解决办法。

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

angular-cli.json

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

它对我有用。感谢关注。

【讨论】：

谢谢。也为我工作.. 只需根据您的 angular-cli.json 检查节点模块的路径并添加路径。对我来说是：“node_modules/ngx-bootstrap/datepicker/bs-datepicker.css”

【解决方案2】：

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

它是为：

"@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 仍然无法正常工作，请尝试将此链接添加到您的 style.css

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

为我解决了问题，希望对您有所帮助！

【讨论】：

【解决方案3】：

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

【讨论】：

【解决方案4】：

对于 Angular 10 和 ngx 版本 6.2.0

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

试试这个 ng add ngx-bootstrap

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

【讨论】：

【解决方案5】：

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

在src/styles.scss

中添加上面的东西

【讨论】：