Question

我正在尝试从打包为节点模块的自定义库中导入样式。假设包名称为@custom。我打算通过以下方式从@custom包中导入较少的文件：

@import '@custom/styles/common.less'

此语句在我添加此导入语句的同一文件夹中搜索'@custom/styles/common.less'。

ERROR in ./src/app/app.component.less
Module build failed:

@import "@custom/styles/common";
^
Can't resolve './@custom/styles/common.less' in '<path>\src\app'
      in <path>\src\app\app.component.less (line 1, column 0)

是否有一种声明relative-path或module-name的方法，以便它在node-modules文件夹中搜索？还是我缺少一些非常基本的东西？

Answer 1

有两种方法，如果只需要将它们与项目一起编译，然后将其包含在您的angular-cli中，如下所示：

"styles": [
    "../node_modules/custom/styles/common.less"

如果要在项目中使用较少的文件并使用其变量，则必须将其包含在angular-cli文件中，如下所示：

 "stylePreprocessorOptions": {
    "includePaths": [
      "../node_modules/custom/styles"
    ]
  },

在组件样式文件中，可以包含较少的文件，例如@import '../styles/<your parent less file>';

无法在angular项目中使用模块名称从node_modules导入.less文件

1 个答案: