diff --git a/package.json b/package.json index bcb0a9a0f33..0bab096b1c9 100644 --- a/package.json +++ b/package.json @@ -104,6 +104,7 @@ "sinon": "^5.0.1", "sourcemap-validator": "^1.0.6", "stylus": "^0.54.5", + "sugarss": "^2.0.0", "typescript": "^3.0.0", "vue": "^2.5.16", "vue-template-compiler": "^2.5.16" diff --git a/src/Parser.js b/src/Parser.js index 926e91bfb97..ca7072da8f3 100644 --- a/src/Parser.js +++ b/src/Parser.js @@ -29,6 +29,7 @@ class Parser { this.registerExtension('css', './assets/CSSAsset'); this.registerExtension('pcss', './assets/CSSAsset'); this.registerExtension('postcss', './assets/CSSAsset'); + this.registerExtension('sss', './assets/SSSAsset'); this.registerExtension('styl', './assets/StylusAsset'); this.registerExtension('stylus', './assets/StylusAsset'); this.registerExtension('less', './assets/LESSAsset'); diff --git a/src/assets/SSSAsset.js b/src/assets/SSSAsset.js new file mode 100644 index 00000000000..38f412eac58 --- /dev/null +++ b/src/assets/SSSAsset.js @@ -0,0 +1,31 @@ +const postcss = require('postcss'); +const localRequire = require('../utils/localRequire'); +const Asset = require('../Asset'); + +class SSSAsset extends Asset { + constructor(name, options) { + super(name, options); + this.type = 'css'; + } + + async generate() { + let sugarss = await localRequire('sugarss', this.name); + + await this.loadIfNeeded(); + + let {css} = await postcss().process(this.contents, { + from: this.name, + to: this.name, + parser: sugarss + }); + + return [ + { + type: 'css', + value: css + } + ]; + } +} + +module.exports = SSSAsset; diff --git a/test/integration/sugarss/index.sss b/test/integration/sugarss/index.sss new file mode 100644 index 00000000000..feb0a45ab7a --- /dev/null +++ b/test/integration/sugarss/index.sss @@ -0,0 +1,5 @@ +input.spoiler-input + display: none + +.spoiler_link + cursor: pointer diff --git a/test/sugarss.js b/test/sugarss.js new file mode 100644 index 00000000000..88e5ff33459 --- /dev/null +++ b/test/sugarss.js @@ -0,0 +1,21 @@ +const assert = require('assert'); +const {bundle, assertBundleTree} = require('./utils'); +const fs = require('../src/utils/fs'); +const path = require('path'); + +describe('sugarss', function() { + it('should correctly parse SugarSS asset', async function() { + let b = await bundle(__dirname + '/integration/sugarss/index.sss'); + + await assertBundleTree(b, { + name: 'index.css', + assets: ['index.sss'] + }); + + let cssContent = await fs.readFile( + path.join(__dirname, '/dist/index.css'), + 'utf8' + ); + assert(cssContent.includes('{')); + }); +}); diff --git a/yarn.lock b/yarn.lock index 48de7b043f2..e54a931ccca 100644 --- a/yarn.lock +++ b/yarn.lock @@ -5577,6 +5577,14 @@ postcss@^6.0.1, postcss@^6.0.19, postcss@^6.0.20: source-map "^0.6.1" supports-color "^5.4.0" +postcss@^7.0.2: + version "7.0.2" + resolved "https://registry.yarnpkg.com/postcss/-/postcss-7.0.2.tgz#7b5a109de356804e27f95a960bef0e4d5bc9bb18" + dependencies: + chalk "^2.4.1" + source-map "^0.6.1" + supports-color "^5.4.0" + posthtml-extend@^0.2.1: version "0.2.1" resolved "https://registry.yarnpkg.com/posthtml-extend/-/posthtml-extend-0.2.1.tgz#d023ce7ce4dd6071071b50e315dfefa87da8a979" @@ -6666,6 +6674,12 @@ stylus@0.54.5, stylus@^0.54.5: sax "0.5.x" source-map "0.1.x" +sugarss@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/sugarss/-/sugarss-2.0.0.tgz#ddd76e0124b297d40bf3cca31c8b22ecb43bc61d" + dependencies: + postcss "^7.0.2" + supports-color@4.4.0: version "4.4.0" resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-4.4.0.tgz#883f7ddabc165142b2a61427f3352ded195d1a3e"