我使用cssnext来编写我的css
:root{
--ellipsis: {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
};
};并在3个地方使用@apply --省略号
.div1{
@apply --ellipsis
}
.div2{
@apply --ellipsis
}
.div3{
@apply --ellipsis
}我使用gulp和postcss-cssnext
gulp.task('postcss',function(){
return gulp.src('src/css/*.css')
.pipe(plumber())
.pipe(postcss([
cssnext({
browsers: ['last 2 versions', 'Android >= 4.0'],
features: {
rem: false
}
})
]))
.pipe(gulp.dest('dist/css'))
});但只有第一个地方是有用的,
.div1{
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.div2{
}
.div3{
}我必须这样写:
:root{
--ellipsis: {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
};
};
.div1{
@apply --ellipsis
}
:root{
--ellipsis: {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
};
};
.div2{
@apply --ellipsis
}
:root{
--ellipsis: {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
};
};
.div3{
@apply --ellipsis
}但这不能写成那样,一定有什么地方不对……
"devDependencies": {
"autoprefixer": "^7.1.1",
"gulp": "^3.9.1",
"gulp-plumber": "^1.1.0",
"gulp-postcss": "^7.0.0",
"postcss-cssnext": "^2.11.0",
}谁能救我...
发布于 2017-06-25 21:32:21
哦...我自己修好的.
我觉得这不是我的错,而是gulp-postcss的问题,它是最新的版本,所以我安装了一个旧的6.4.0,它起作用了……
https://stackoverflow.com/questions/44719514
复制相似问题