【前端工程化】使用postcss-import

在这篇文章中介绍了使用postcss的方法，本篇文章介绍另一个重要的兼容css的插件，故名思义他是用来处理css文件中的import的语句的。

在postcss.config.js中的配置如下

module.exports = {
    plugins: {
        'postcss-import': {},
        autoprefixer: {},
    },
}

比如有一个css文件如下

@import './test.css';

.box {
    border: 1px solid;
    display: flex;
}

在打包之后会给test.css中的css代码也增加浏览器前缀。

所以以后的项目，在关于css浏览器兼容，这块至少需要安装3个包

1. postcss

2. postcss-import

3. autoprefixer