Question

现在，我将转到混合的angular / angularjs项目。但是我遇到了导入样式问题。

例如，我的简单angularJs组件：

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

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

export const SimpleComponent = {
  template,
  controller
};

我希望样式会被提取并包含在项目中。在我切换到有角度的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":true中添加angular.json -> projects.projectName.architect.serve.options规则。但这是行不通的。我在github上约"extractCss"选项创建了issue。但是，也许我不明白"extractCss"选项的确切含义，并将'MiniCssExtractPlugin'插件功能委托给它吗？

2）在“ src / app”文件夹中创建“ app.less”，然后向其中添加所有组件样式。之后，将其包含到“ angular.json”->“样式”：[“ src / app / app.less”]。但这需要很多开销，因为我们有很多组件=）

感谢您的关注=）

Angular CLI：在ngUpgrade混合项目中包含angularjs组件样式

0 个答案: