StartPolymer · gucong3000 · May 9, 2018 · May 8, 2018
diff --git a/.travis.yml b/.travis.yml
@@ -6,8 +6,5 @@ node_js:
  - stable
  - 4

-before_install:
-  - npm i npm@latest -g
-
 after_script:
  - npm run coveralls
diff --git a/README.md b/README.md
@@ -4,9 +4,12 @@
 [![Build Status](https://img.shields.io/travis/StartPolymer/gulp-html-postcss.png)](https://travis-ci.org/StartPolymer/gulp-html-postcss)
 [![Coverage Status](https://img.shields.io/coveralls/StartPolymer/gulp-html-postcss.png)](https://coveralls.io/r/StartPolymer/gulp-html-postcss)

-[PostCSS](https://github.com/postcss/postcss) gulp plugin to pipe inline CSS in HTML within the `<style>` tags through
-several plugins, but parse CSS only once.
-
+[PostCSS](https://github.com/postcss/postcss) gulp plugin with support for HTML and HTML-like:
+- [JSX](https://reactjs.org/docs/introducing-jsx.html)
+- [Vue component](https://vue-loader.vuejs.org/)
+- [Quick App](https://doc.quickapp.cn/framework/source-file.html)
+- [Markdown](https://daringfireball.net/projects/markdown/syntax)
+
 ## Install

    $ npm install --save-dev gulp-html-postcss

diff --git a/lib/loadConfig.js b/lib/loadConfig.js
@@ -1,4 +1,5 @@
 'use strict';
+const syntax = require('postcss-syntax');
 const postcssLoadConfig = require('postcss-load-config');
 const loadOptions = require('postcss-load-options/lib/options.js');
 const loadPlugins = require('postcss-load-plugins/lib/plugins.js');
@@ -7,6 +8,9 @@ function loadConfig (file, config) {
 	const map = file.sourceMap ? { annotation: false } : false;
 	function handleResult (config) {
 		const options = config.options || {};
+		if (!(options.syntax || options.stringifier || options.parser)) {
+			options.syntax = syntax;
+		}
 		options.map = map;
 		config.options = options;
 		return config;
@@ -17,6 +21,7 @@ function loadConfig (file, config) {
 		from: file.history[0],
 		to: file.path,
 		cwd: file.cwd,
+		syntax: syntax,
 		map: map,
 	};


diff --git a/lib/process.js b/lib/process.js
@@ -3,7 +3,6 @@ const PluginError = require('plugin-error');
 const postcss = require('postcss');
 const applySourceMap = require('./applySourceMap');
 const loadConfig = require('./loadConfig');
-const autoSyntax = require('postcss-html');

 function process (buffer, file, config) {
 	function handleResult (result) {
@@ -26,55 +25,7 @@ function process (buffer, file, config) {
 		throw new PluginError('gulp-postcss', error, errorOptions);
 	}
 	return loadConfig(file, config).then((config) => {
-		const syntax = autoSyntax(config.options.syntax);
-		const document = syntax.parse(buffer, Object.assign({}, config.options));
-		if (document.source.syntax) {
-			return postcss(
-				config.plugins
-			).process(
-				document,
-				Object.assign(
-					{
-						syntax: document.source.syntax,
-					},
-					config.options
-				)
-			);
-		} else if (document.nodes.length) {
-			return Promise.all(
-				document.nodes.map((root) => {
-					return postcss(
-						config.plugins
-					).process(
-						root,
-						config.options
-					);
-				})
-			).then((results) => {
-				const messages = results.reduce((messages, result) => {
-					return messages.concat(result.messages);
-				}, []);
-				const lastResult = results.pop();
-				return Object.assign(
-					new lastResult.constructor(lastResult.processor, document, lastResult.opts),
-					{
-						lastPlugin: lastResult.lastPlugin,
-						css: document.toString(),
-						messages: messages,
-					}
-				);
-			});
-		} else {
-			return document.toResult(
-				Object.assign(
-					{},
-					config.options,
-					{
-						syntax: syntax,
-					}
-				)
-			);
-		}
+		return postcss(config.plugins).process(buffer, config.options);
 	}).then(handleResult, handleError);
 }


diff --git a/package.json b/package.json
@@ -13,7 +13,7 @@
    "all": true,
    "check-coverage": true
  },
-  "version": "7.0.5",
+  "version": "7.1.0",
  "description": "Process inline CSS in HTML using PostCSS gulp plugin",
  "main": "lib/index.js",
  "scripts": {
@@ -46,10 +46,15 @@
    "bufferstreams": "^2.0.1",
    "plugin-error": "^1.0.1",
    "postcss-html": "^0.23.6",
+    "postcss-jsx": "^0.9.0",
    "postcss-load-config": "^1.2.0",
    "postcss-load-options": "^1.2.0",
    "postcss-load-plugins": "^2.3.0",
+    "postcss-markdown": "^0.23.6",
+    "postcss-sass": "^0.3.1",
+    "postcss-scss": "^1.0.5",
    "postcss-syntax": "^0.9.0",
+    "sugarss": "^1.0.1",
    "vinyl-sourcemaps-apply": "^0.2.1"
  },
  "peerDependencies": {
@@ -67,7 +72,7 @@
    "gulp-rename": "^1.2.2",
    "gulp-sourcemaps": "^2.6.4",
    "mocha": "^5.1.1",
-    "nyc": "^11.7.1",
+    "nyc": "^11.7.2",
    "postcss": "^6.0.22",
    "postcss-less": "^1.1.5",
    "proxyquire": "^2.0.1",

diff --git a/test/index.js b/test/index.js
@@ -10,6 +10,7 @@ const proxyquire = require('proxyquire');
 const sinon = require('sinon');
 const path = require('path');
 const from = require('from2-array');
+const syntax = require('postcss-syntax');

 it('should pass file when it isNull()', (cb) => {
 	const stream = postcss([ doubler ]);
@@ -167,13 +168,27 @@ describe('PostCSS Syntax Infer', () => {
 		stream.end();
 	});

-	it('should show error for `MODULE_NOT_FOUND`', (cb) => {
-		const stream = postcss([doubler]);
+	it('should catch error from parser', (cb) => {
+		const stream = postcss({
+			syntax: {
+				parse: () => {
+					throw new Error('mock syntax error');
+				},
+			},
+			plugins: [
+				doubler,
+			],
+		});

 		stream.on('error', (error) => {
-			assert.equal(error.code, 'MODULE_NOT_FOUND');
-			assert.equal(error.message, 'Cannot find module \'postcss-sass\'');
-			cb();
+			try {
+				assert.equal(error.message, 'mock syntax error');
+				assert.ifError(error.lineNumber);
+				assert.ok(error.showStack);
+				cb();
+			} catch (ex) {
+				cb(ex);
+			}
 		});

 		stream.write(new Vinyl({
@@ -254,9 +269,14 @@ describe('PostCSS Guidelines', () => {
 		rename.pipe(stream);

 		stream.on('data', (file) => {
-			assert.equal(file.postcss.opts.to, cssPath);
-			assert.equal(file.postcss.opts.from, mdPath);
-			cb();
+			const opts = postcssStub.process.getCall(0).args[1];
+			try {
+				assert.equal(opts.to, cssPath);
+				assert.equal(opts.from, mdPath);
+				cb();
+			} catch (ex) {
+				cb(ex);
+			}
 		});

 		rename.write(new Vinyl({
@@ -315,6 +335,7 @@ describe('PostCSS Guidelines', () => {
 			try {
 				assert.deepEqual(callback.getCall(0).args[0], {
 					cwd: process.cwd(),
+					syntax: syntax,
 					from: cssPath,
 					file: file,
 					map: false,
@@ -354,16 +375,21 @@ describe('PostCSS Guidelines', () => {
 		}));

 		stream.on('data', () => {
-			assert.deepEqual(postcssLoadConfigStub.getCall(0).args[0], {
-				cwd: process.cwd(),
-				from: cssPath,
-				file: file,
-				map: false,
-				to: cssPath,
-			});
-			assert.equal(postcssStub.use.getCall(0).args[0], plugins);
-			assert.equal(postcssStub.process.getCall(0).args[1].to, 'overriden');
-			cb();
+			try {
+				assert.deepEqual(postcssLoadConfigStub.getCall(0).args[0], {
+					cwd: process.cwd(),
+					syntax: syntax,
+					from: cssPath,
+					file: file,
+					map: false,
+					to: cssPath,
+				});
+				assert.equal(postcssStub.use.getCall(0).args[0], plugins);
+				assert.equal(postcssStub.process.getCall(0).args[1].to, 'overriden');
+				cb();
+			} catch (ex) {
+				cb(ex);
+			}
 		});

 		stream.end(file);
@@ -519,6 +545,7 @@ describe('<style> tag', () => {

 		stream.write(new Vinyl({
 			contents: Buffer.from(createHtml('a { color: black }')),
+			path: '/test/fixture_style_tag.html',
 		}));

 		stream.on('error', cb);
@@ -544,6 +571,7 @@ describe('<style> tag', () => {

 		stream.write(new Vinyl({
 			contents: Buffer.from(html),
+			path: '/test/fixture_without_style_tag.html',
 		}));

 		stream.on('error', cb);
@@ -570,6 +598,7 @@ describe('<style> tag', () => {

 		stream.write(new Vinyl({
 			contents: Buffer.from(createHtml('a { color: black }')),
+			path: '/test/fixture_remove_nodes.html',
 		}));

 		stream.on('error', cb);
@@ -594,6 +623,7 @@ describe('<style> tag', () => {

 		stream.write(new Vinyl({
 			contents: Buffer.from(createVue('a { color: black }')),
+			path: '/test/fixture.vue',
 		}));

 		stream.on('error', cb);