postcss

postcss는 다양한 기능들을 제공해주는 css 라이브러리이다.
웹팩과 연동하여 추가적인 css 기능들을 이용할 수 있다.

autoprefixer, postcss-color-function, postcss-custom-properties

등등의 기능을 사용할 수 있게 해준다.
즉 postcss는 css의 다양한 기능들을 사용할 수 있게해주는 것이다.

grunt나 gulp가 그렇듯 혼자서 뭔가 특별한 것을 한다기 보다 플러그인들을 붙여서 이것저것 할 수 있는 것이다.

webpack에 설치하는 것이며 postcss.config.js에 설정을 기재할 수 있다.

module.exports = {
	plugins: [
    	require('autoprefixer'),
        require('postcss-nested')
    ]
}

웹펙에서 postcss를 불러와야 한다.

module.exprots = {
	module: {
    	rules: [
        	test: /\.css$/,
            exclude: /node_modules/,
            use: [
            	{
                	loader: 'postcss-loader'
                }
            ]
        ]
    }
}

위 내용은 웹펙에서 .css을 만나면 postcss-loader를 실행한다는 뜻이다.