Неверный MIME-тип с пользовательским сервером Next.js - PullRequest
Новая
       31

Неверный MIME-тип с пользовательским сервером Next.js

0 голосов
/ 13 марта 2019

Я пишу приложение Next.js с пользовательским файлом server.js, и я не могу загрузить свой CSS - я продолжаю получать следующее в консоли браузера: 

The resource from “http://localhost:3000/_next/
static/development/pages/index.js?ts=1552499710032” 
was blocked due to MIME type (“text/html”) 
mismatch (X-Content-Type-Options: nosniff)

и я не знаю почему. Насколько я могу судить, я настроил свое приложение так же, как и для предыдущей рабочей версии. Вот мой следующий файл .config.js: 

const withCSS = require('@zeit/next-css');
const withImages = require('next-images');
const path = require('path')
const Dotenv = require('dotenv-webpack')
require('dotenv').config()

module.exports =  withImages(withCSS({
  webpack: config => {
    // Fixes npm packages that depend on `fs` module
    config.node = {
      fs: 'empty'
    }

    config.plugins = config.plugins || []

    config.plugins = [
      ...config.plugins,

      // Read the .env file
      new Dotenv({
        path: path.join(__dirname, '.env'),
        systemvars: true
      })
    ]

    return config
  }
}))

А вот мой файл server.js: 

const express = require('express')
const next = require('next')

const port = parseInt(process.env.PORT, 10) || 3000
const dev = process.env.NODE_ENV !== 'production'
const app = next({ dev })
const handle = app.getRequestHandler()


const path = require('path');
const options = {
  root: path.join(__dirname, '/static'),
  headers: {
    'Content-Type': 'text/plain;charset=UTF-8',
  }
};


app.prepare().then(() => {
  const server = express()

  server.get('/robots.txt', (req, res) => {
    return res.status(200).sendFile('robots.txt', options)
  });

  server.get('/sitemap.xml', (req,res) => {
    return res.status(200).sendFile('sitemap.xml', options)
  });

  server.get('/', (req, res) => {
    return app.render(req, res, '/', req.query)
  })

  server.listen(port, err => {
    if (err) throw err
    console.log(`> Ready on http://localhost:${port}`)
  })
})

Я запускаю свое приложение, используя node server.js, и импортирую CSS, используя import "./styles/root.css" (мой единственный и единственный файл CSS), поэтому никаких сюрпризов нет. Что не так?

РЕДАКТИРОВАТЬ: Это достаточно тривиально, что это может быть ошибка. Я открыл отчет здесь: https://github.com/zeit/next.js/issues/6647.

1 Ответ

1 голос
/ 13 марта 2019

Вам не хватает 

server.get('*', (req, res) => {
    return handle(req, res)
})

в вашем server.js.репозиторий github будет работать нормально, если вы раскомментируете приведенный выше код и перезапустите сервер

...