Kompilieren weniger Datei angular2 cli

Question

Ich habe folgende Einstellungen in Winkel-cli-build

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

I'have zwei Tests weniger Dateien in src Verzeichnis.

test1.less

//some code 

test2.less

@import "test1.less"; 

wenn ich das Projekt ng build wirft er einen Fehler

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

ich issue 873 temporäre Lösung ausprobiert habe. Der Fehler ist verschwunden, konnte aber keine kompilierten CSS-Dateien finden. bitte helfen. wie kompiliert man angepasste bootstrap less-Dateien in angular2 project, das von angle-cli erstellt wird.

wie kann ich erweitere die von der Bootstrap weniger Datei (blieb innerhalb node_modules) mit meiner benutzerdefinierten lesses

Answer 1

Wenn Sie weniger mit npm install less --save installieren und die CSS-Datei in Ihrer Komponente Verzeichnis umbenennen, sollte es funktionieren. Das gleiche funktioniert für Sass, wie in angular-cli Dokumentation/Readme-Datei beschrieben.

Ich habe den Import Arbeit durch die other.less Datei in /shared directory geben und mit dem vollständigen Pfad jetzt ./src/app/shared/other.less

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

es funktioniert, ohne einen Fehler zu importieren.

Bearbeiten: es funktioniert auch mit @import (less) "./src/app/other.less";.

Answer 2

offene Winkel cli.json und legt einen neuen Eintrag in das Array Arten

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

weniger installieren, wenn nötig. Ich weiß nicht, ob das erforderlich ist. Aber ich hatte das vorher getan.

npm install less --save 

Answer 3

Wenn Sie ein neues Projekt:

ng new project_name --style less 

Dann, wenn Sie einen Blick auf Ihr Projekt übernehmen, werden Sie eine weniger Datei in jeder Komponente Ordner finden, anstatt ein CSS in der einen Hand. Wenn Sie andererseits die Datei component.ts einer Komponente betrachten, finden Sie in @Component, styleUrls: ['./xxx.component**.less**'] anstelle von ['./ xxx.Komponente **.css ** ']

Für Montagen wie @Kaspars tun, sagte:

npm install less --save 

Wenn Sie fertig sind:

• Umbenennungs alle CSS-Dateien im Verzeichnis Ihrer Komponente auf weniger

• ändern Sie ['./xxx.component.css'] durch ['./xxx.component.less] in jeder Komponentendatei

Wenn Sie SCSS wollen nicht weniger, tun das etwas, was