postcss转换内联样式

可以使用 postcss-inline-styles 插件将内联样式转换为 CSS 样式。该插件会将 HTML 中的内联样式提取出来，然后将其转换为对应的 CSS 样式。

安装命令如下：

npm install postcss postcss-inline-styles --save-dev

使用示例：

const postcss = require('postcss');
const inlineStyles = require('postcss-inline-styles');

const css = `
  p {
    color: red;
    background-color: blue;
    font-size: 16px;
    padding: 10px;
  }

  <p style="color: blue; font-weight: bold;">Hello, world!</p>
`;

postcss([inlineStyles])
  .process(css)
  .then(result => {
    console.log(result.css);
  });

输出结果：

p {
  color: red;
  background-color: blue;
  font-size: 16px;
  padding: 10px;
}

._inline-style_0 {
  color: blue;
  font-weight: bold;
}

<p class="_inline-style_0">Hello, world!</p>