postcss-px-to-viewport可以实现全局字体大小设置吗

`postcss-px-to-viewport` 可以实现将 `px` 单位转换为视口单位（`vw`、`vh`、`vmin` 或 `vmax`），但是它并不能直接实现全局字体大小设置。

如果你想要设置全局字体大小，可以考虑使用 `rem` 单位。你可以在根元素上设置一个基准字体大小，然后在其他元素中使用相对于基准字体大小的 `rem` 单位来设置字体大小。这样可以实现全局字体大小的一次性设置。

如果你使用 `postcss-px-to-viewport` 转换 `px` 单位为视口单位，也可以利用 `viewport` 的大小来计算出一个基准字体大小，然后使用 `rem` 单位来设置字体大小。具体的计算方法可以参考 `postcss-px-to-viewport` 的文档。

相关问题

postcss-px-to-viewport 可以实现全局字体大小设置吗

可以的，`postcss-px-to-viewport` 可以通过设置 `viewportWidth` 和 `viewportHeight` 来实现将 `px` 转换为 `vw` 或 `vh`，从而实现全局字体大小设置。

你可以在配置文件中添加以下代码：

module.exports = {
  plugins: [
    require('postcss-px-to-viewport')({
      viewportWidth: 750,  // 视窗的宽度，对应设计稿的宽度
      viewportHeight: 1334, // 视窗的高度，对应设计稿的高度
      unitPrecision: 3,     // 指定 `px` 转换为视窗单位值的小数位数
      viewportUnit: 'vw',   // 指定需要转换成的视窗单位，建议使用 vw
      selectorBlackList: ['.ignore', '.hairlines'],  // 指定不需要转换的类名，可以自定义
      minPixelValue: 1,     // 小于或等于 `1px` 不转换为视窗单位
      mediaQuery: false     // 允许在媒体查询中转换 `px`
    }),
    // 其他插件
  ]
}

在代码中使用 `px` 作为单位来设置字体大小，`postcss-px-to-viewport` 会自动将其转换为相应的 `vw` 值。例如，如果设计稿中某个字体大小为 `32px`，那么在代码中可以这样设置：

font-size: 32px;

`postcss-px-to-viewport` 会将其转换为：

font-size: 4.26667vw;

这样就可以实现全局字体大小的设置。

postcss-px-to-viewport怎么实现全局调整字体大小

要在整个项目中使用postcss-px-to-viewport调整字体大小，可以在webpack配置中添加postcss.config.js文件，并在其中添加postcss-px-to-viewport插件的配置。

下面是一个示例的postcss.config.js文件，其中设置了viewportWidth为375，即设计稿宽度为375px，同时将所有的字体大小都转换为相应的vw值：

module.exports = {
  plugins: {
    'postcss-import': {},
    'postcss-url': {},
    'autoprefixer': {},
    'postcss-px-to-viewport': {
      viewportWidth: 375,
      selectorBlackList: [],
      minPixelValue: 1,
      unitToConvert: 'px',
      viewportUnit: 'vw',
      fontViewportUnit: 'vw',
      mediaQuery: false,
      replace: true,
      exclude: /(\/|\\)(node_modules)(\/|\\)/,
      landscape: false,
      landscapeUnit: 'vw',
      landscapeWidth: 568
    }
  }
}

通过以上配置，我们可以将所有的字体大小转换为vw单位，以适应不同屏幕尺寸的设备。同时，我们还可以通过selectorBlackList属性来排除一些不需要转换的选择器，例如以下样式将不会被转换：

.selector {
  font-size: 12px; /* 不会被转换 */
}