将 node-sass-json-importer 集成到 Angular CLI 应用程序中 [英] Integrate node-sass-json-importer into an Angular CLI application

问题描述

尝试将 node-sass-json-importer 添加到 AngularCLI 应用程序.

我使用的是 CLI 的 1.0.0-beta.17 版本，但使用当前版本 1.2 也无法弄清楚.通过yarn安装后，我不知道应该在应用程序配置中的哪个位置进行设置.

有没有人成功地将其集成到他们的应用程序中?我能找到的唯一答案适用于使用 Webpack 的应用程序，但不适用于 Angular CLI.

解决方案

通过改变styles.js解决了这个问题

node_modules/@angular/cli/models/webpack-configs/styles.js

在上述文件中，按如下所述进行编辑

const jsonImporter = require('node-sass-json-importer');

<块引用>

并在 .scss 的规则中添加 importer: jsonImporter

{ 测试:/\.scss$|\.sass$/，使用:[{loader: 'sass-loader',选项: {源映射:cssSourceMap，//bootstrap-sass 要求最小精度为 8精度:8，包括路径，进口商:jsonImporter，}}]}

这可能不是最好的解决方案，但可以解决您的问题，在这种情况下，我无法看到将参数传递给 node-sass 的选项 --importer './node_modules/node-sass-json-进口商',

根据此链接 https://github.com/angular/angular-cli/issues/1791 它只允许单独的 includePaths 选项.

希望这有帮助！！！

Trying to add the node-sass-json-importer into an Angular CLI application.

I was using version 1.0.0-beta.17of the CLI, but haven't been able to figure it out using the current version 1.2 either. After installing it via yarn I don't know where it should be setup in the application configuration.

Has anyone successfully integrated this into their application? The only answer I could find regarding this is for applications using Webpack, but not for the Angular CLI.

解决方案

Solved this by changing the styles.js

node_modules/@angular/cli/models/webpack-configs/styles.js 

In the above file , edit as mentioned below

const jsonImporter = require('node-sass-json-importer');

and add importer: jsonImporter in the rule for .scss

{ test: /\.scss$|\.sass$/, use: [{
                    loader: 'sass-loader',
                    options: {
                        sourceMap: cssSourceMap,
                        // bootstrap-sass requires a minimum precision of 8
                        precision: 8,
                        includePaths,
                        importer: jsonImporter,
                    }
                }]
        }

This might not be the best solution but solves your issue , there is no option i can see to pass the args to node-sass here in this case it is --importer './node_modules/node-sass-json-importer' ,

as per this link https://github.com/angular/angular-cli/issues/1791 it allows only includePaths option alone.

Hope this helps !!!

这篇关于将 node-sass-json-importer 集成到 Angular CLI 应用程序中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！