Transform url()
in css.
url(customTransforms) customTransformsvar url = require('postcss-custom-url')
var util = url.util
Â
var postcss = require('postcss')
var path = require('path')
var fixtures = path.resolve.bind(path, __dirname, 'fixtures')
Â
postcss(url([
  [ util.inline, { maxSize: 5 } ],
 Â
  [ 'copy', { assetOutFolder: fixtures('build', 'images') } ],
]))
.process(
  '.a{ background-image: url(images/octocat_setup.png); }',
  { from: fixtures('a.css'), to: fixtures('build', 'css', 'a.css') }
)
.then(function (result) {
  console.log(result.css)
 Â
})
Â
Type: Array
Default: [ util.rebase ]
An array of transforms.
If an element is not a function, it should be the name of a method exported by util
: 'copy'
, 'inline'
, 'rebase'
.
Type: Function
, Array
Signature: transformFn(result, ...args)
Function to transform url, through modifying result.url
If Array
, the first element should be the transform function, and elements after the first will be treated as its arguments args
.
Type: Result
Properties and methods:
url
: String
from
: The CSS source pathto
: The CSS destination pathfile
: The asset source pathasset
: Asset
.isRelative()
: Function
Result.getFile(url, opts)
. Return the file
property.Result.dataUrl(file)
Properties and methods:
mimeType
size()
: Return a promise to get the size of the assetdata()
: Return a promise to get the contents of the assetshasum()
: Return a promise to get the sha1 of the contents of the assetbase64()
: Return a promise to get the base64 of the contents of the assetdataUrl()
: Return a promise to get the data url of the assetA group of transform methods.
rebaseTransform result.url
according to result.to
Transform result.url
to data-url.
Options:
maxSize
: Number
, default: 10
. Specify the maximum file size to inline (in kbytes)Copy asset files to proper destinations and transform result.url
.
Options:
useHash
: Boolean
, default: false
. If true
, assets are renamed by their sha1 hashes.name
: String
, default: null
. Specify how to rename the asset. It only works when useHash
is false. Special patterns:
[name]
: replaced with the basename of the asset, without the extension.[hash]
: replaced with the hashassetOutFolder
: String
, Function
. Specify the destination where assets should be copied. If Function
, it receives the asset file path and result.opts
, and should return the output folder. Urls are transformed based on the destination, unless baseUrl
is specified.baseUrl
: String
, default: null
. Specify the base url for assets.var url = require('postcss-custom-url')
var postcss = require('postcss')
Â
postcss(url([
  [
    'copy',
    {
     Â
     Â
     Â
      assetOutFolder: '/path/to/build/images',
Â
     Â
      name: '[name].[hash]',
Â
     Â
     Â
Â
     Â
     Â
    },
  ],
]))
.process(
  '.a{ background-image: url(images/octocat_setup.png); }',
  { from: '/path/to/src/style.css', to: '/path/to/build/css/style.css' }
)
.then(function (result) {
  console.log(result.css)
 Â
})
Â
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4