diff --git a/README.md b/README.md index da918e0..5a1f711 100644 --- a/README.md +++ b/README.md @@ -67,7 +67,7 @@ npm install vueify --save-dev browserify -t vueify -e src/main.js -o build/build.js ``` -If you are using npm 3+, it no longer auto install the peer dependencies. So you will also have to also install the babel-related dependencies: +If you are using npm 3+ and **babel**, it no longer auto install the peer dependencies. So you will also have to also install the babel-related dependencies: ``` bash npm install\ @@ -121,9 +121,9 @@ Make sure to have the `NODE_ENV` environment variable set to `"production"` when If you are using Gulp, note that `gulp --production` **does not** affect vueify; you still need to explicitly set `NODE_ENV=production`. -## ES2015 by Default +## ES2015 when `babel-core` installed -Vueify automatically transforms the JavaScript in your `*.vue` components using Babel. Write ES2015 today! +Vueify automatically transforms the JavaScript in your `*.vue` components using Babel when it is installed. Write ES2015 today! The default Babel (6) options used for Vue.js components are: diff --git a/lib/compiler.js b/lib/compiler.js index 09bb491..fa9a9ef 100644 --- a/lib/compiler.js +++ b/lib/compiler.js @@ -22,6 +22,13 @@ try { hotReloadAPIPath = 'vueify/node_modules/vue-hot-reload-api' } +var hasBabel = true +try { + require('babel-core') +} catch (e) { + hasBabel = false +} + var htmlMinifyOptions = { collapseWhitespace: true, removeComments: true, @@ -149,7 +156,7 @@ compiler.compile = function (content, filePath, cb) { ' hotAPI.install(require("vue"), true)\n' + ' if (!hotAPI.compatible) return\n' + // remove style tag on dispose - (style + ((style && 'object' === typeof(__vueify_style__) && __vueify_style__ instanceof Node) ? ' module.hot.dispose(function () {\n' + ' __vueify_insert__.cache[' + style + '] = false\n' + ' document.head.removeChild(__vueify_style__)\n' + @@ -291,7 +298,8 @@ function processStyle (node, filePath, id) { */ function processScript (node, filePath, content) { - var lang = checkLang(node) || 'babel' + var lang = checkLang(node) || (hasBabel ? 'babel' : null) + var script = checkSrc(node, filePath) if (!script) { script = parse5.serialize(node) diff --git a/lib/style-rewriter.js b/lib/style-rewriter.js index a212d0a..3639240 100644 --- a/lib/style-rewriter.js +++ b/lib/style-rewriter.js @@ -45,9 +45,16 @@ module.exports = function (id, css, scoped) { if (val) { return Promise.resolve(val) } else { - var plugins = options.postcss - ? options.postcss.slice() - : [] + var plugins = [] + var opts = {} + + if (options.postcss instanceof Array) { + plugins = options.postcss.slice() + } else if (options.postcss instanceof Object) { + plugins = options.postcss.plugins || [] + opts = options.postcss.options + } + // scoped css rewrite if (scoped) { plugins.push(addId) @@ -66,7 +73,7 @@ module.exports = function (id, css, scoped) { } currentId = id return postcss(plugins) - .process(css) + .process(css, opts) .then(function (res) { var val = { source: res.css, @@ -77,3 +84,4 @@ module.exports = function (id, css, scoped) { }) } } + diff --git a/package.json b/package.json index e11b99f..6e9e0ab 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "vueify", - "version": "8.5.4", + "version": "8.7.0", "description": "Vue component transform for Browserify", "main": "index.js", "repository": {