autoprefixer

How to use lost, autoprefixer and postcss-flexibility?

ぐ巨炮叔叔 提交于 2019-12-12 04:11:38
问题 I want to know the order in which we should use autoprefixer , lost , postcssflexibility in webpack ? 回答1: Here's a basic example (prefixing through postcss, applying precss plugin etc.). webpack 1 const autoprefixer = require('autoprefixer'); const precss = require('precss'); module.exports = { module: { loaders: [ { test: /\.css$/, loaders: ['style', 'css', 'postcss'], }, ], }, // PostCSS plugins go here postcss: function () { return [autoprefixer, precss]; }, }; webpack 2 module: { rules:

Angular 7 - Autoprefixer not working with CSS Grid

我的未来我决定 提交于 2019-12-10 23:39:03
问题 I am trying to get Angular7 working nicely with the Autoprefixer. I'm specifically looking to get support on IE11. I've removed the "not" from "IE 9 - 11" in the browserlist file. I've also added /* autoprefixer grid: autoplace / / autoprefixer grid: on */ To the top of my _grid.scss file. Problem is grid items are still not getting any prefixes. Flexbox seems to work fine but not CSS grid. Is there any configuration I've missed? 回答1: I had dependency issues. Ran npm audit fix and the issue

Autoprefixer errors with NPM (✖ Plugin Error: Cannot find module )

老子叫甜甜 提交于 2019-12-08 12:50:39
问题 So currently I am having troubles with autoprefixer. I have downloaded postcss-cli and autoprefixer to --save-dev and -g When I run a command like this: postcss ../../../htdocs/css/workflow/homepage-announcements.css -o ../../../htdocs/css/workflow/homepage-announcements.css works fine with an output of: ✔ Finished ../../../htdocs/css/workflow/homepage-announcements.css (25ms) Now that I have used --use autoprefixer an error is thrown. Command below. postcss --use autoprefixer ../../../htdocs

Webpack error: configuration has an unknown property 'postcss'

自作多情 提交于 2019-12-07 03:25:08
问题 After upgrading to the latest version of webpack, I'm seeing this error: WebpackOptionsValidationError: Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema. - configuration has an unknown property 'postcss'. These properties are valid: object { amd?, bail?, cache?, context?, dependencies?, devServer?, devtool?, entry, externals?, loader?, module?, name?, node?, output?, plugins?, profile?, recordsInputPath?,

gulp autoprefixer doesn't add moz prefix

两盒软妹~` 提交于 2019-12-07 03:14:43
问题 I am using gulp with autoprefixer in my project, and I have to use backgrounds gradient like this: background: linear-gradient(#e98a00, #f5aa2f); but output is: background:-webkit-linear-gradient(#e98a00,#f5aa2f); background:linear-gradient(#e98a00,#f5aa2f); What wrong with me? Part of Gulpfile.js gulp.task('styles', function() { return gulp.src(['css/less/mainPage.less']) .pipe(plumber()) // .pipe(concat('base.scss')) .pipe(less()) .pipe(prefix([{ browsers: ['IE 8', 'IE 9', 'last 5 versions'

Use SASS (from command line) and Autoprefixer (for Bootstrap 4.x)

别来无恙 提交于 2019-12-06 22:28:44
问题 I have recently started using the scss files, especially to customize Bootstrap . To compile my scss files (and also bootstrap) i use sass from the command line. Example : sass /path/to/scss/bootstrap/mycustom.scss /path/to/css/bootstrap.min.css -t compressed -C --sourcemap=none mycustom.scss is something like that: $theme-colors: ( "custom-primary": "...", "custom-secondary": "..." ); .... .... @import "bootstrap"; This way i can customize bootstrap to my pleasure, without problems. Today,

Webpack error: configuration has an unknown property 'postcss'

夙愿已清 提交于 2019-12-05 08:15:43
After upgrading to the latest version of webpack, I'm seeing this error: WebpackOptionsValidationError: Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema. - configuration has an unknown property 'postcss'. These properties are valid: object { amd?, bail?, cache?, context?, dependencies?, devServer?, devtool?, entry, externals?, loader?, module?, name?, node?, output?, plugins?, profile?, recordsInputPath?, recordsOutputPath?, recordsPath?, resolve?, resolveLoader?, stats?, target?, watch?, watchOptions? } For typos:

gulp autoprefixer doesn't add moz prefix

丶灬走出姿态 提交于 2019-12-05 07:49:00
I am using gulp with autoprefixer in my project, and I have to use backgrounds gradient like this: background: linear-gradient(#e98a00, #f5aa2f); but output is: background:-webkit-linear-gradient(#e98a00,#f5aa2f); background:linear-gradient(#e98a00,#f5aa2f); What wrong with me? Part of Gulpfile.js gulp.task('styles', function() { return gulp.src(['css/less/mainPage.less']) .pipe(plumber()) // .pipe(concat('base.scss')) .pipe(less()) .pipe(prefix([{ browsers: ['IE 8', 'IE 9', 'last 5 versions', 'Firefox 14', 'Opera 11.1'] }])) .pipe(minifyCSS({keepBreaks: true})) .pipe(gulp.dest('css')) .pipe

Use SASS (from command line) and Autoprefixer (for Bootstrap 4.x)

徘徊边缘 提交于 2019-12-05 04:07:16
I have recently started using the scss files, especially to customize Bootstrap . To compile my scss files (and also bootstrap) i use sass from the command line. Example : sass /path/to/scss/bootstrap/mycustom.scss /path/to/css/bootstrap.min.css -t compressed -C --sourcemap=none mycustom.scss is something like that: $theme-colors: ( "custom-primary": "...", "custom-secondary": "..." ); .... .... @import "bootstrap"; This way i can customize bootstrap to my pleasure, without problems. Today, however, i realized that a graphic component (custom-select) was not rendered correctly. After some

文本超出隐藏

删除回忆录丶 提交于 2019-12-04 10:56:27
1.单行文本超出隐藏 overflow: hidden; text-overflow:ellipsis; white-space: nowrap; 2、多行文本超出隐藏 display: -webkit-box; /* autoprefixer: off*/ -webkit-box-orient: vertical; /* autoprefixer: on*/ -webkit-line-clamp: 3; overflow: hidden; 注意:-webkit-box-orient: vertical;这个一定要写成 /* autoprefixer: off*/ -webkit-box-orient: vertical; /* autoprefixer: on*/ 否则编译完成之后会被删除 来源: https://my.oschina.net/u/4138368/blog/3129599