如何更改Nuxt.js配置生成头样式表?

问题描述

我有问题。我需要编译两个单独的scss文件,但仅包含一个。哪一个-我必须从快递的会议中得到。

这里是nuxt.config.js的示例。构建完nuxt之后,将所有这2个文件添加到head。

  build: {
    extend(config,{ isDev,isClient }) {
      if (isClient) {
        Object.assign(config,{
          entry: {
            day: '~/assets/scss/day/day.scss',night: '~/assets/scss/night/night.scss'
          }
        })
      }
      // Sets webpack's mode to development if `isDev` is true.
      if (isDev) {
        config.mode = 'development'
      } else {
        config.mode = 'production'
      }
    },

第二种方法,使用express-handlebars进行自定义布局。但是我不明白如何获取包括nuxt标记到此布局,因为我需要SSR。代码示例

const hbs = require('express-handlebars');
const path = require('path');
const { loadNuxt,build } = require('nuxt');
const app = require('express')();
const is_ie = (str) => str.includes('MSIE') || str.includes('Trident');
const port = process.env.PORT || 3001;
// We instantiate Nuxt.js with the options
const config = require('./nuxt.config.js');
const nuxt = new Nuxt(config);

// Get a ready to use Nuxt instance
const nuxt = await loadNuxt(isDev ? 'dev' : 'start');

// Enable live build & reloading on dev
if (isDev) {
  build(nuxt);
}
// view engine setup
app.engine(
  'hbs',hbs({
    extname: 'hbs',defaultLayout: 'layout',layoutsDir: path.join(__dirname,'/views/'),})
);
app.set('views',path.join(__dirname,'views'));
app.set('view engine','hbs');
app.use(nuxt.render(req,res));
app.get('*',(req,res) => {
  console.log(res,req)
  const theme = req.cookies && req.cookies.theme ? req.cookies.theme : 'night';
  const theme_file = `${theme}.css`;

  res.render('app.hbs',{
    theme: theme_file,is_ie: is_ie(req.headers['user-agent']),title: process.env.Meta_TITLE,description: process.env.Meta_DESCRIPTION,});
});
app.listen(port,'localhost',() => {
  console.log(`Server is listening on port: ${port}`);
});

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)