P11:生产环境打包
Posted wgchen~
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了P11:生产环境打包相关的知识,希望对你有一定的参考价值。
Next.js 教程
阐述
本文主要带大家学一下Next.js在生产环境下如何进行打包和在打包过程中遇到的一些坑。
其实Next.js大打包时非常简单的,只要一个命令就可以打包成功。
但是当你使用了Ant Desgin后,在打包的时候会遇到一些坑。
打包 :next build
运行:next start -p 80
先把这两个命令配置到 package.json
文件里,比如配置成下面的样子。
"scripts":
"dev": "next dev",
"build": "next build",
"start": "next start -p 80"
,
然后在终端里运行一下 yarn build
,如果这时候报错,其实是我们在加入Ant Design 的样式时产生的,这个已经在Ant Design的Github上被提出了,但目前还没有被修改,你可以改完全局引入CSS解决问题。
在page
目录下,新建一个_app.js
文件,然后写入下面的代码。
import App from 'next/app'
import 'antd/dist/antd.css'
export default App
这样配置一下,就可以打包成功了,然后再运行yarn start来运行服务器,看一下我们的header页面,也是有样式的。说明打包已经成功了。
以上是关于P11:生产环境打包的主要内容,如果未能解决你的问题,请参考以下文章
[万字逐步详解]使用 webpack 打包 vue 项目(优化生产环境)
十分钟完成Springboot 生产环境搭建代码仓库安装自动打包部署(密码登录)
十分钟完成Springboot 生产环境搭建代码仓库安装自动打包部署(密码登录)
十分钟完成Springboot 生产环境搭建代码仓库安装自动打包部署