1:create nextjs项目
npx create-next-app@latest
2:安装axios
npm install axios
3:编写axios请求接口
const fetchData = async ( url:string , options = {}) => {
try {
const response = await axios.get(url);
return response.data;
} catch (error) {
console.error('Error retrieving data:', error);
throw new Error('Could not get data');
}
};
4:项目由于是client-side-render 所以在next.config配置请求子路径和output导出
/** @type {import('next').NextConfig} */
const nextConfig = {
output: 'export',
basePath: '/nextjs-axios',
};
export default nextConfig;
5:最后运行编译命定
npm run build
6: 把out文件放到nginx路径下面
location /nextjs-axios {
alias /var/www/nextjs-axios
}
github地址
