diff --git a/lib/loader.js b/lib/loader.js index 300d222f..c35c8942 100644 --- a/lib/loader.js +++ b/lib/loader.js @@ -5,11 +5,43 @@ var path = require("path"); var loaderUtils = require("loader-utils"); var camelCase = require("lodash.camelcase"); +var escapeRegexp = require("escape-regexp"); var processCss = require("./processCss"); var getImportPrefix = require("./getImportPrefix"); - module.exports = function(content, map) { + // ワークアラウンド + // postcss-spritesに各コンポーネント用のsprite.pngを渡す方法がわからない + if (map) { + var pathtoSprites = path.resolve('client/images/sprites'); + var parsedMap = JSON.parse(map); + var hasSprite = content.match(/url\(client\/images\/sprites/) ? true : false; + var nestedImport1 = escapeRegexp('../../../styles'); + var nestedImport2 = escapeRegexp('../../../../styles'); + var nestedImport3 = escapeRegexp('../../../../../styles'); + var isNested1 = parsedMap.sources.filter(function(source) { + return source.match(nestedImport1); + }).length > 0; + var isNested2 = parsedMap.sources.filter(function(source) { + return source.match(nestedImport2); + }).length > 0; + var isNested3 = parsedMap.sources.filter(function(source) { + return source.match(nestedImport3); + }).length > 0; + + if (hasSprite) { + if (isNested3) { + content = content.replace(/url\(client\/images\/sprites\//g, 'url(../../../../../images/sprites/'); + } else if (isNested2) { + content = content.replace(/url\(client\/images\/sprites\//g, 'url(../../../../images/sprites/'); + } else if (isNested1) { + content = content.replace(/url\(client\/images\/sprites\//g, 'url(../../../images/sprites/'); + } else { + content = content.replace(/url\(client\/images\/sprites\//g, 'url(../../images/sprites/'); + } + } + } + if(this.cacheable) this.cacheable(); var callback = this.async(); var query = loaderUtils.parseQuery(this.query); diff --git a/package.json b/package.json index ea267dac..30c3a110 100644 --- a/package.json +++ b/package.json @@ -6,9 +6,10 @@ "dependencies": { "css-selector-tokenizer": "^0.5.1", "cssnano": ">=2.6.1 <4", + "escape-regexp": "0.0.1", "loader-utils": "~0.2.2", - "object-assign": "^4.0.1", "lodash.camelcase": "^3.0.1", + "object-assign": "^4.0.1", "postcss": "^5.0.6", "postcss-modules-extract-imports": "1.0.0-beta2", "postcss-modules-local-by-default": "^1.0.0",