我通过 npm css 包导入了 iconfont.css,但是找不到 iconfont.woff 和 iconfont.tff。我该如何解决?
吞咽文件
var postcss = require('gulp-postcss');
var atImport = require('postcss-import');
var cssnano = require('cssnano');
gulp.task('importcss', function () {
var processors = [
atImport({}),
cssnano()
];
return gulp.src('./htdocs/css/common.css')
.pipe(postcss(processors))
.pipe(gulp.dest('./htdocs/css-build/'))
});
Npm Css 字体
css/common.css
css-build/common.css
页面
最佳答案
您需要使用 https://github.com/postcss/postcss-url在 postcss 导入之后。 postcss-url 将调整您的 URL 路径。
默认情况下,它会调整您的 URL 以引用 node_modules
中的原始文件。
如果您不在部署中包含 node_modules
,它将无法工作。要解决此问题,请设置 url
option到复制
。这会将所有 Assets 复制到 css-build/assets/
并相应地调整 URL。
您还可以将 url
设置为 inline
,这将对您的所有 Assets 进行 base64 编码并将其内联。除非您的 Assets 非常小,否则我不建议使用它。
关于css - 找不到 postcss 导入 iconfont .woff .ttf,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39761187/