https://github.com/rawcreative/vueify-extract-css

Browserify plugin to extract CSS from single-file Vue components into a separate file
https://github.com/rawcreative/vueify-extract-css

Last synced: about 2 months ago
JSON representation

Browserify plugin to extract CSS from single-file Vue components into a separate file

• Host: GitHub
• URL: https://github.com/rawcreative/vueify-extract-css
• Owner: rawcreative
• License: other
• Created: 2016-03-23T21:02:44.000Z (over 8 years ago)
• Default Branch: master
• Last Pushed: 2016-06-20T13:28:28.000Z (over 8 years ago)
• Last Synced: 2024-09-18T02:04:55.783Z (3 months ago)
• Language: JavaScript
• Homepage:
• Size: 3.91 KB
• Stars: 32
• Watchers: 4
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

• awesome-vue-cn - vueify-extract-css ★18 - Browserify plugin to extract css from Vueify-compiled single file components to a separate css file. (Awesome Vue.js [](https://github.com/sindresorhus/awesome) / Development Tools)
• awesome-vuejs - vueify-extract-css - Browserify plugin to extract css from Vueify-compiled single file components to a separate css file. (Awesome Vue.js / Development Tools)

README

        
# vueify-extract-css [![stability][0]][1]

Looks up `require('vueify-insert-css')` calls to extract CSS from a browserify bundle

to a file. 

## Command line

```sh

$ browserify -t vueify -p [ vueify-extract-css -o bundle.css ] index.js \

  -o bundle.js

```

## JS api

```js

const browserify = require('browserify')

browserify()

  .transform('vueify')

  .plugin('vueify-extract-css', { out: 'bundle.css' })

  .bundle()

```

```js

const browserify = require('browserify')

browserify()

  .transform('vueify')

  .plugin('vueify-extract-css', { out: createWriteStream })

  .bundle()

function createWriteStream () {

  return process.stdout

}

```

## Laravel Elixir

In your gulpfile, along with laravel-elixir-vueify:

```js

var elixir = require('laravel-elixir');

require('laravel-elixir-vueify');

elixir.config.js.browserify.plugins.push({

    name: 'vueify-extract-css',

    options: {

		out: 'path/to/extracted/bundle.css'

	}

});

```

## Options

- `-o` / `--out`: specify an outfile, defaults to `bundle.css`. Can also be a

  function that returns a writable stream from the JavaScript API.

## Installation

```sh

$ npm install vueify-extract-css

```

## See Also

- [vueify](https://github.com/vuejs/vueify)

- [insert-css](https://github.com/substack/insert-css)

## License

[MIT](https://tldrlegal.com/license/mit-license)

[0]: https://img.shields.io/badge/stability-experimental-orange.svg?style=flat-square

[1]: https://nodejs.org/api/documentation.html#documentation_stability_index