Security News
Combatting Alert Fatigue by Prioritizing Malicious Intent
In 2023, data breaches surged 78% from zero-day and supply chain attacks, but developers are still buried under alerts that are unable to prevent these threats.
grunt-autoprefixer
Advanced tools
Parse CSS and add vendor-prefixed CSS properties using the Can I Use database. Based on Autoprefixer.
Autoprefixer parses CSS and adds vendor-prefixed CSS properties using the Can I Use database.
This plugin requires Grunt ~0.4.0
If you haven't used Grunt before, be sure to check out the Getting Started guide, as it explains how to create a Gruntfile as well as install and use Grunt plugins. Once you're familiar with that process, you may install this plugin with this command:
npm install grunt-autoprefixer --save-dev
Once the plugin has been installed, it may be enabled inside your Gruntfile with this line of JavaScript:
grunt.loadNpmTasks('grunt-autoprefixer');
In your project's Gruntfile, add a section named autoprefixer
to the data object passed into grunt.initConfig()
.
grunt.initConfig({
autoprefixer: {
options: {
// Task-specific options go here.
},
your_target: {
// Target-specific file lists and/or options go here.
},
},
})
Type: Array
Default value: ['> 1%', 'last 2 versions', 'Firefox ESR', 'Opera 12.1']
You can specify browsers actual for your project:
options: {
browsers: ['last 2 version', 'ie 8', 'ie 9']
}
Type: Boolean
Default value: false
Pass true
to enable ‘cascade’ indentation. Read more here.
Type: Boolean|String
Default value: false
Set it to true
if you want to get an output patch file:
options: {
diff: true // or 'custom/path/to/file.css.patch'
}
Also you can specify a path where to save this file. More examples in Gruntfile.
Type: Boolean|String|undefined
Default value: undefined
If the map option isn't defined, Autoprefixer will look for source map from a previous compilation step (either inline map or separate one) and update it automatically. Let's say you have path/file.css
and path/file.css.map
from SASS, Autoprefixer will find that map, update it and save to a specified destination.
If true
is specified, Autoprefixer will try to find an input source map file as described above and generate a new map based on the found one (or just generate a new map, unlike the situation when the map option is undefined).
If you keep your map from a pre-processor in another directory (e.g. path/file.css
and another-path/file.css.map
), you can specify the path another-path/
in the map option to point out where grunt-autoprefixer should look for an input map to update it.
Also you can specify false
. In that case Autoprefixer will not generate or update source map even if there is one from a previous compilation step near an input file or inlined to it (Autoprefixer will delete a map annotation comment from an input file).
You cannot specify a path where to save a map file, it will be saved at the same directory as the output CSS file or inlined to it (check out the option below).
Type: Boolean|undefined
Default value: undefined
If the option isn't specified, Autoprefixer will inline its map if a map from a previous compilation step was inlined to an input file or save its map as a separate file respectively.
You can specify true
or false
to force that behaviour as you like.
grunt.initConfig({
autoprefixer: {
options: {
// Task-specific options go here.
},
// prefix the specified file
single_file: {
options: {
// Target-specific options go here.
},
src: 'src/css/file.css',
dest: 'dest/css/file.css'
},
// prefix all files
multiple_files: {
expand: true,
flatten: true,
src: 'src/css/*.css', // -> src/css/file1.css, src/css/file2.css
dest: 'dest/css/' // -> dest/css/file1.css, dest/css/file2.css
},
// if you have specified only the `src` param, the destination will be set automatically,
// so source files will be overwritten
no_dest: {
src: 'dest/css/file.css' // globbing is also possible here
},
diff: {
options: {
diff: true
},
src: 'src/css/file.css',
dest: 'dest/css/file.css' // -> dest/css/file.css, dest/css/file.css.patch
},
sourcemap: {
options: {
map: true
},
src: 'src/css/file.css',
dest: 'dest/css/file.css' // -> dest/css/file.css, dest/css/file.css.map
},
}
});
Check out project's Gruntfile.js for more examples.
$ npm update caniuse-db
In lieu of a formal styleguide, take care to maintain the existing coding style. Add unit tests for any new or changed functionality. Lint and test your code using Grunt.
FAQs
Parse CSS and add vendor-prefixed CSS properties using the Can I Use database. Based on Autoprefixer.
The npm package grunt-autoprefixer receives a total of 33,777 weekly downloads. As such, grunt-autoprefixer popularity was classified as popular.
We found that grunt-autoprefixer demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
In 2023, data breaches surged 78% from zero-day and supply chain attacks, but developers are still buried under alerts that are unable to prevent these threats.
Security News
Solo open source maintainers face burnout and security challenges, with 60% unpaid and 60% considering quitting.
Security News
License exceptions modify the terms of open source licenses, impacting how software can be used, modified, and distributed. Developers should be aware of the legal implications of these exceptions.