Merge pull request #5 from faebeee/feature/enhanced-output-filenamepa…

…ttern Add support for the same variable multiple times in output name
SassNinja · Mar 20, 2019 · 9dda615 · 9dda615
2 parents ebd2a13 + 4c64809
commit 9dda615
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 5 deletions.
diff --git a/index.js b/index.js
@@ -67,7 +67,7 @@ module.exports = postcss.plugin('postcss-extract-media-query', opts => {
             // or otherwise the query key (converted to kebab case)
             const hasCustomName = typeof opts.queries[atRule.params] === 'string';
             const key = hasCustomName === true
-                        ? opts.queries[atRule.params] 
+                        ? opts.queries[atRule.params]
                         : _.kebabCase(atRule.params);
 
             // extract media atRule and concatenate with existing atRule (same key)
@@ -83,12 +83,12 @@ module.exports = postcss.plugin('postcss-extract-media-query', opts => {
             if (opts.output.path) {
 
                 const newFile = opts.output.name
-                                .replace('[name]', name)
-                                .replace('[query]', key)
-                                .replace('[ext]', ext);
+                                .replace(/\[name\]/g, name)
+                                .replace(/\[query\]/g, key)
+                                .replace(/\[ext\]/g, ext)
 
                 const newFilePath = path.join(opts.output.path, newFile);
-                
+
                 // create new root
                 // and append all extracted atRules with current key
                 const newRoot = postcss.root();

diff --git a/test/options.js b/test/options.js
@@ -80,6 +80,18 @@ describe('Options', function() {
             assert.isTrue(fs.existsSync('test/output/screen-and-min-width-1024-px.css'));
             assert.isTrue(fs.existsSync('test/output/screen-and-min-width-1200-px.css'));
         });
+        it('output.name should support using the same placeholder multiple times', function () {
+            const opts = {
+                output: {
+                    path: path.join(__dirname, 'output'),
+                    name: '[query]-[query].[ext]'
+                },
+                stats: false
+            };
+            postcss([plugin(opts)]).process(exampleFile, { from: 'test/data/example.css' }).css;
+            assert.isTrue(fs.existsSync('test/output/screen-and-min-width-1024-px-screen-and-min-width-1024-px.css'));
+            assert.isTrue(fs.existsSync('test/output/screen-and-min-width-1200-px-screen-and-min-width-1200-px.css'));
+        });
     });
 
     describe('queries', function() {