nuxt.js 使用rem

Nuxt.js本身并没有直接使用rem的特性，但是可以通过一些插件或者配置来实现。

一种方式是使用postcss-pxtorem插件，它可以将CSS中的像素单位转换为rem单位。你可以在Nuxt.js的配置文件中的build.postcss中配置该插件。例如：

build: {
  postcss: [
    require('postcss-pxtorem')({
      rootValue: 16,
      propList: ['*']
    })
  ]
}

这里的rootValue表示1rem所对应的像素值，propList则表示需要转换的CSS属性。

另一种方式是使用vue-meta插件，在HTML的head中设置一个基准字体大小，例如：

head: {
  meta: [
    { name: 'viewport', content: 'width=device-width, initial-scale=1' },
    { name: 'apple-mobile-web-app-capable', content: 'yes' },
    { name: 'apple-mobile-web-app-status-bar-style', content: 'black' }
  ],
  script: [
    { innerHTML: 'document.documentElement.style.fontSize = document.documentElement.clientWidth / 10 + "px";' }
  ]
}

这里的script标签会在页面加载时执行，将HTML根元素的字体大小设置为屏幕宽度的十分之一。然后你可以在CSS中使用rem单位来设置字体大小等属性。