Node-sass不了解代字号 [英] Node-sass does not understand tilde

问题描述

探索最近发布的Angular2的RC1的angular-cli时，我遇到一个奇怪的问题:在angular-cli的sass插件中的node-sass不会在包名称抛出以下错误之前解析~:

Exploring the angular-cli for RC1 of Angular2 released recently I faced strange problem: node-sass within sass plugin in the angular-cli does not parses ~ before the package name throwing following error:

Error: File to import not found or unreadable: ~@angular2-material/core/style/theme-functions

在编译以下代码时会发生:

It happens during compiling the following code:

@import "~@angular2-material/core/style/theme-functions";

如果我删除波浪号，一切都会好的.这是正确的行为，还是有一条使node-sass理解~的路径?

If I remove tilde everything will be ok. Is it the right behavior, or there is a path to make node-sass understand ~?

PS .我使用WebStorm，它也更喜欢使用~.如果省略了波浪号，则会抱怨无法解析路径.经过一番谷歌搜索之后，我发现使用不带波浪号的代码是很传统的，应该使用~作为最佳实践.这样对吗?

P.S. I use WebStorm, and it prefers using ~ too. If tilde is omitted it complains to unability of resolving path. And after some googling I found that using code without tilde is legacy and ~ should be used as best practice. Is it right?

推荐答案

Webpack可以完成潮汐路径解析，node-sass内置没有这样的解析器.编写自己的导入分辨率.

Tilde path resolving is something that webpack does, node-sass doesn't have such a resolver built in. sass-loader for webpack has this. You can write your own import resolution alternatively.

为完整起见，这是不使用自定义导入程序而没有webpack/sass-loader的情况下如何做:

Just for completeness here's how you might do it without webpack/sass-loader using a custom importer:

function importer(url, prev, done) {
  if (url[0] === '~') {
    url = path.resolve('node_modules', url.substr(1));
  }

  return { file: url };
}

这篇关于Node-sass不了解代字号的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！