9

我在 angular-cli-build 中进行了以下设置

Angular2App(defaults,{
 lessCompiler: {
     includePaths: [
       'src/app'
      ],
   }
})

我在目录中有两个测试较少的文件src。

test1.less

//some code

test2.less

@import "test1.less";

当我ng build的项目它抛出一个错误

Build failed.
File: input (1)
The Broccoli Plugin: [LESSPlugin] failed with:
undefined

我已经尝试过问题 873临时解决方案。错误消失了。但找不到任何已编译的 css 文件。请帮忙。如何在由 angular-cli 构建的 angular2 项目中编译自定义引导程序更少的文件。

我如何用我的自定义 lesses 扩展引导程序的 less 文件（留在 node_modules 中）

4

3 回答 3

14

打开 angular-cli.json 并在样式数组中插入一个新条目

"styles": [
    "styles.css",
    "less/app.less"
  ],

如果需要，请减少安装。我不知道这是否需要。但我事先已经这样做了。

npm install less --save
于 2017-01-24T21:37:20.657 回答
4

如果您 npm install less --save在组件目录中安装 less 并重命名 CSS 文件，它应该可以工作。如angular-cli文档/自述文件中所述，对 sass 的工作方式相同。

我通过将other.less文件放入/shared directory并使用完整路径导入它来完成导入工作./src/app/shared/other.less

@import (less) "./src/app/shared/other.less";

它现在可以正常工作了。

编辑：它也可以使用@import (less) "./src/app/other.less";。

于 2016-06-22T20:18:20.270 回答
1

创建新项目时：

ng new project_name --style less

然后，当您查看您的项目时，您会发现每个组件文件夹中的文件较少，而不是一方面的 css 文件。而另一方面，当你查看一个组件的 component.ts 文件时，你会在@Component 中找到 styleUrls: ['./xxx.component**.less**'] 而不是 ['./ xxx.component**.css**']

对于安装后，请像@Kaspars 说的那样：

npm install less --save

完成后：

  • 将组件目录中的所有 CSS 文件重命名为 less

  • 在每个组件文件中将 ['./xxx.component.css'] 更改为 ['./xxx.component.less']

如果你想要 scss 而不是更少，做一些事情

于 2017-11-26T20:12:32.777 回答