首页 文章

Angular 6 - 更少的CSS'导入不再起作用

提问于
浏览 次
1

我想重新使用一个使用Less的Angular 5项目中的一些结构 . 在这个旧项目中，我可以在组件中使用此行简单地加载 .less 文件：

@import '~app/shared/less/bootstrap';

这会加载：

/my-app/src/app/shared/less/bootstrap.less

现在我有一个空白的Angular 6项目，它也被配置为使用Less作为预处理器：

ng new my-app --routing --style less

Extract from angular.json ：

"my-app": {
  "prefix": "app",
  "schematics": {
    "@schematics/angular:component": {
      "styleext": "less"
    }
  },
  "architect": {
    "build": {
      "options": {
        "styles": [
          "src/styles.less",
          "app/shared/less/styles.less"

但行

@import '~app/shared/less/bootstrap';

...编译错误：

编译失败 . ./src/app/shared/component/some.component.less模块构建失败：@import'~app / shared / less / bootstrap';找不到^'~app / shared / less / bootstrap' .

我也尝试过：

@import '.app/shared/less/bootstrap';
@import '.src/app/shared/less/bootstrap';
@import '~app/shared/less/bootstrap.less';

......没有运气 .

我忘了配置一些东西吗？

javascript css angular less

1 回答

  • 2

    在角度6中你必须 import 所有文件到main（在你的情况下是 src/styles.less ）css文件：

    In angular.json put ONLY:

    "styles": [
          "src/styles.less"
]

    In styles.less (import all files you want with / before app):

    @import './app/shared/less/bootstrap.less';

    在这里查看我对css的回答：Angular 6 load css folders in angular.json

    To your edit ./src/app..:

    @import './src/app/...'
    回复于

相关问题