首先感叹一句，next 真是一个版本狂人啊，一周就一个下版本
1. 依照官网的形式初始化一个Next.js我的项目遇到的一些问题
默认初始化的框架款式反对sass，组件级别的
[name].module.css，但默认不反对less，官网提供了配置less的办法`yarn add @zeit/next-less less`// next.config.jsconst withLess = require('@zeit/next-less')module.exports = withLess({ webpack(config, options) { config.resolve = { alias: { ...config.resolve.alias, // 配置alias同时要在tsconfig.json 配置 baseUrl，paths "@": path.resolve(__dirname, ".") }, extensions: [".ts", ".tsx", ".js", ".jsx", ".less", ".css"] }; return config }})重新启动后会报
Error: Cannot find module 'webpack'于是就装置webpack但默认装置的是webpack@5.x，依照这个 issue，要替换成 webpack@4.x 才能够- Next.js 打包后动态资源门路中的
_next目录哪来的 ？
参考此文
打包配置 配置assetPrefix，相当于webpack外面的publicPath（将动态资源放在cdn）
但打包后html引入的动态资源地址会多一层_next目录，解决方案：
本人代码里创立_next目录太过繁琐，且耗费性能，故让运维在拷贝动态资源时，在oss目录上多加一层_next目录 - ssr框架 ajax 申请库的抉择
node-fetch、window, document的应用注意事项 getInitialProps getStaticProps getStaticPaths getServerSideProps的区别clint Link跳转时子页面款式文件获取不到（如同只有开发阶段有次问题，临时未解决）- 当进行重构我的项目时，如果不想扭转老我的项目的url（可能因为url曾经被百度seo收录），能够利用自定义node服务器，将老url转发到新的url，参考文档，
然而有个问题这种被转发的url为什么浏览器申请会是 404，但页面还是会失常显示，不晓得是为什么？？？
2. 生产部署
- 接入公司cicd标准，部署没有应用传统的pm2，而是把服务放在一个容器内，服务重启靠node提供一个健康检查接口，容器来保障服务稳固，当该接口没有失常返回docker容器就会重启利用
因为公司标准启动node服务都是在容器内用
node app.js，但next默认启动是靠next start启动生产服务的。解决方案是：next提供了自定义服务器，我这里采纳了koa，将next作为一个中间件来解决参考// https://www.nextjs.cn/docs/advanced-features/custom-serverconst Koa = require('koa') // 引入 koaconst next = require('next') // nextjs 作为中间件const routesMap = require('./route') // 新老url抵触时，将老url转发const dev = process.env.NODE_ENV === 'development' // 判断是否处于开发者状态const app = next({ dev }) // 初始化 nextjs，判断它是否处于 dev：开发者状态，还是production: 正式服务状态const handle = app.getRequestHandler() // 拿到 http 申请的响应console.log('next dev环境===>', dev)const port = 8080// app.prepare：编译 pages 文件夹上面的页面文件，then 是保障 pages 下页面全副编译完了之后，咱们能力真正的启动服务来响应申请。// 如果这些内容咱们没有编译实现，那么启动服务响应申请的时候可能会报错。app.prepare().then(() => { const server = new Koa() // 申明一个 server /** 这是 Koa 的外围用法：中间件。通常给 use 外面写一个函数，这个函数就是中间件。 * params: * ctx: Koa Context 将 node 的 request 和 response 对象封装到单个对象中，为申请上下文对象 * next: 调用后将执行流程转入下一个中间件，如果以后中间件中没有调用 next，整个中间件的执行流程则会在这里终止，后续中间件不会失去执行 */ server.use(async (ctx, next) => { if (routesMap[ctx.path]) { // 老url转发~~~~，这种操作页面能够失常进去，但不晓得为什么浏览器状态码会是404 await app.render(ctx.req, ctx.res, routesMap[ctx.path]) } else { await handle(ctx.req, ctx.res) } ctx.response = false }) server.listen(port) console.log(`请拜访： http://localhost:${port}`)