browserify-css - npm Package Compare versions

Comparing version 0.5.0 to 0.6.0

gulp/tasks/bundles.js

		@@ -22,2 +22,3 @@ var _ = require('lodash');
		.transform(require('../../index'), bundleTransform['browserify-css'])
		.require('./browser', {expose: 'browserify-css'})
		.bundle()
		@@ -24,0 +25,0 @@ .pipe(exorcist(bundleMapFile))

index.js

		@@ -65,5 +65,5 @@ 'use strict';
		if (options.autoInjectOptions['verbose']) {
		moduleBody = 'var css = ' + JSON.stringify(data) + '; (require(' + JSON.stringify(__dirname) + ').createStyle(css, { "href": ' + JSON.stringify(href) + '})); module.exports = css;';
		moduleBody = 'var css = ' + JSON.stringify(data) + '; (require(' + JSON.stringify('browserify-css') + ').createStyle(css, { "href": ' + JSON.stringify(href) + '})); module.exports = css;';
		} else {
		moduleBody = 'var css = ' + JSON.stringify(data) + '; (require(' + JSON.stringify(__dirname) + ').createStyle(css)); module.exports = css;';
		moduleBody = 'var css = ' + JSON.stringify(data) + '; (require(' + JSON.stringify('browserify-css') + ').createStyle(css)); module.exports = css;';
		}
		@@ -70,0 +70,0 @@ }

package.json

		{
		"name": "browserify-css",
		"version": "0.5.0",
		"version": "0.6.0",
		"description": "A Browserify transform for bundling, rebasing, inlining, and minifying CSS files",
		@@ -5,0 +5,0 @@ "main": "./index.js",

README.md

		@@ -33,3 +33,3 @@ # browserify-css [![build status](https://travis-ci.org/cheton/browserify-css.svg?branch=master)](https://travis-ci.org/cheton/browserify-css) [![Coverage Status](https://coveralls.io/repos/cheton/browserify-css/badge.svg)](https://coveralls.io/r/cheton/browserify-css)
		You can compile your app by passing -t browserify-css to browserify:
		```
		``` bash
		$ browserify -t browserify-css app.js > bundle.js
		@@ -40,3 +40,3 @@ ```

		```
		``` html
		<html>
		@@ -125,3 +125,3 @@ <head>
		The `processRelativeUrl` option accepts a function which takes one argument (the relative url) and returns the original `relativeUrl` string or the converted result. For example:
		```javascript
		``` javascript
		var browserify = require('browserify');
		@@ -132,3 +132,3 @@
		.transform(require('browserify-css'), {
		rootDir: '.',
		rootDir: 'src',
		processRelativeUrl: function(relativeUrl) {
		@@ -138,7 +138,7 @@ return relativeUrl;
		})
		.bundle()
		.bundle();
		```

		You can embed the image data directly into the CSS file with data URI, like so:
		```javascript
		``` javascript
		var _ = require('lodash');
		@@ -151,3 +151,3 @@ var path = require('path');
		.transform(require('browserify-css'), {
		rootDir: '.',
		rootDir: 'src',
		processRelativeUrl: function(relativeUrl) {
		@@ -163,5 +163,7 @@ if (_.contains(['.jpg','.png','.gif'], path.extname(relativeUrl))) {
		})
		.bundle()
		.bundle();
		```

		You may also want to check out the [FAQ](https://github.com/cheton/browserify-css#2-how-do-i-load-font-and-image-files-from-node_modules) for advanced usage.

		### rootDir
		@@ -202,3 +204,3 @@

		``` js
		``` javascript
		var browserify = require('browserify');
		@@ -230,4 +232,5 @@ var b = browserify('./app.js');
		Assume that you have the following directory structure:
		```
		``` bash
		package.json
		dist/
		src/
		@@ -241,3 +244,13 @@ index.js
		bootstrap.css
		```

		The `index.css` uses `@import` to import external style sheets:
		``` css
		@import url("../node_modules/bootstrap/dist/css/bootstrap.css");
		```

		All output files, including the generated `bundle.js`, are created under the `dist` directory:
		``` bash
		dist/
		bundle.js
		vendor/
		@@ -248,14 +261,8 @@ bootstrap/
		bootstrap.css
		bundle.js
		```

		The `index.css` uses `@import` to import external style sheets:
		```css
		@import url("../node_modules/bootstrap/dist/css/bootstrap.css");
		```
		Suppose that the `dist` directory is your web root, you might want to copy external font and images files from `../node_modules/` to `dist/vendor/`.

		The generated `bundle.js` file is placed in the `dist` directory. Suppose that the `dist` directory is your web root, you might want to copy external font and images files from `../node_modules/` to `dist/vendor/`.

		For example, the `@font-face` rules in `node_modules/bootstrap/dist/css/bootstrap.css`:
		```css
		``` css
		@font-face {
		@@ -273,4 +280,5 @@ font-family: 'Glyphicons Halflings';
		The example below illustrates the use of the `processRelativeUrl` option:
		```javascript
		``` javascript
		var gulp = require('gulp');
		var gutil = require('gulp-util');
		var path = require('path');
		@@ -297,5 +305,5 @@ var browserify = require('browserify');
		if (_.startsWith(relativePath, prefix)) {
		var vendorUrl = 'vendor/' + relativePath.substring(prefix.length);
		var vendorPath = 'vendor/' + relativePath.substring(prefix.length);
		var source = path.join(rootDir, relativePath);
		var target = path.join(rootDir, vendorUrl);
		var target = path.join(rootDir, vendorPath);

		@@ -305,4 +313,4 @@ gutil.log('Copying file from ' + JSON.stringify(source) + ' to ' + JSON.stringify(target));

		// Returns a new url with original query string and hash fragments
		return vendorUrl + queryStringAndHash;
		// Returns a new path string with original query string and hash fragments
		return vendorPath + queryStringAndHash;
		}
		@@ -309,0 +317,0 @@

examples/submodules/bundle.js

Sorry, the diff of this file is too big to display

examples/submodules/bundle.js.map

Sorry, the diff of this file is not supported yet

browserify-css - npm Package Compare versions

Improved metrics