nuxt引入全局css,怎末判断路径问题

在nuxt中，我们可以在`nuxt.config.js`中配置全局css文件的路径，例如：

module.exports = {
  css: [
    // 全局CSS文件路径
    '@/assets/css/global.css'
  ]
}

在上面的例子中，`@`代表`src`目录，也就是我们项目的根目录。

如果你的全局CSS文件不在`src`目录下，你需要根据实际路径进行配置。例如，如果你的全局CSS文件在`public`目录下，你可以这样配置：

module.exports = {
  css: [
    // 全局CSS文件路径
    '/css/global.css'
  ]
}

在上面的例子中，`/`代表`public`目录，也就是我们项目的根目录。

总之，你只需要根据实际路径进行配置即可。

相关问题

nuxt怎末判断通过config引入的css在服务端加载成功

可以通过在nuxt.config.js中配置serverMiddleware来实现在服务端加载CSS后输出日志的功能。具体步骤如下：

1. 在nuxt.config.js中添加serverMiddleware配置项：

export default {
  serverMiddleware: [
    {
      path: '/css-loaded',
      handler: '~/middleware/css-loaded.js'
    }
  ]
}

2. 创建中间件文件middleware/css-loaded.js，该中间件会在服务端加载CSS后输出日志：

export default function (req, res, next) {
  console.log('CSS loaded successfully on server!')
  next()
}

3. 在HTML模板中添加一个隐藏的图片，该图片的src属性指向serverMiddleware中定义的path，这样当该图片被加载时，中间件会被触发，输出日志：

<img src="/css-loaded" style="display:none;">

这样即可判断通过config引入的css在服务端是否加载成功。

Nuxt怎么引入全局scss变量

要在Nuxt中引入全局SCSS变量，可以如下操作：

1. 在`assets`目录下创建`scss`文件夹，并在其中创建一个`variables.scss`文件，用于定义全局变量。
2. 在`nuxt.config.js`中配置`styleResources`选项，指定需要注入到每个组件中的SCSS文件路径，包括刚刚创建的全局变量文件。

export default {
  ...
  buildModules: [
    '@nuxtjs/style-resources'
  ],
  styleResources: {
    scss: [
      '~/assets/scss/variables.scss'
    ]
  },
  ...
}

3. 在需要使用全局变量的组件中，使用`@import`引入全局变量文件。

<style lang="scss">
  @import '~/assets/scss/variables.scss';

  ...
</style>

这样，就可以在所有组件中使用全局变量了。