6

现在我正在转向一个混合 angular/angularjs 项目。但我坚持导入样式问题。

例如,我的简单 angularJs 组件:

import template from './simple.html';
import controller from './simple.controller.js';

import './simple.less'; // <-- Look at

export const SimpleComponent = {
  template,
  controller
};

我希望样式将被提取并包含在项目中。在我切换到 angular-CLI 之前,所有的魔法都是因为“ MiniCssExtractPlugin ”。

如果我创建角度组件:

@Component({
  selector: 'app-simple',
  templateUrl: './simple.html'
  styleUrls: ['./simple.less']
})

所有样式添加正确。同样,如果我使用 angular.json ->

(path) projects.projectName.architect.build.options.styles 
"styles": [ "src/assets/styles/index.less" ]

现在我提出了两种解决问题的方法(第一种不起作用,第二种会很紧要关头):

1)"extractCss":trueangular.json -> projects.projectName.architect.serve.options. 但它不起作用。我在 github 上创建了关于选项的问题。"extractCss"但也许我不明白"extractCss"选项的确切含义,并将“MiniCssExtractPlugin”插件功能委托给它?

2) 在 'src/app' 文件夹中创建 'app.less' 并将所有组件样式添加到其中。之后将其包含到 'angular.json' -> "styles": ["src/app/app.less"]。但这需要很多开销,因为我们有很多组件 =)

谢谢关注=)

4

0 回答 0