Question

将Material-ui与Next js一起使用时，样式无法正常工作。

得到警告：

“警告：道具className不匹配。服务器：”

我在下面的带有Material-ui example的Nextjs中使用了。

环境：

Ubuntu : 18.10
Material-ui: 3.9.3
NextJs : 8.0.4

我已经创建了用于生产（PM2 server.js）的自定义服务器文件（server.js），使用npm run dev命令在本地计算机上可以正常工作，但是在实时服务器上，我认为自定义存在一些问题server.js文件。

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();

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

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

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

Packege.json文件

{
  "name": "nextjs-next",
  "version": "4.0.0",
  "private": true,
  "dependencies": {
    "@material-ui/core": "next",
    "@material-ui/icons": "^3.0.2",
    "@material-ui/styles": "next",
    "apollo-boost": "^0.3.1",
    "clsx": "latest",
    "express": "^4.16.4",
    "graphql": "^14.2.0",
    "isomorphic-unfetch": "^3.0.0",
    "joi-browser": "^13.4.0",
    "jss": "next",
    "next": "latest",
    "prop-types": "latest",
    "react": "latest",
    "react-apollo": "^2.5.3",
    "react-dom": "latest"
  },
  "scripts": {
    "dev": "node server.js",
    "build": "next build",
    "prod_start": "NODE_ENV=production node server.js"
  }
}

任何人请提出可能的解决方案来解决此问题。

谢谢

Answer 1

应为pm2 start server.js，而不是pm2 server.js。如果该应用的行为很奇怪，请将其放在脚本标签"prod_server": "NODE_ENV=production pm2 start server.js"中。希望这会有所帮助

Material-ul样式无法正常工作，得到警告：道具`className`不匹配。服务器

1 个答案: