我在 _app.js 组件中使用 getInitialProps,但是当我重新加载页面时,请求不会执行。
例如:
// getData.js
import * as axios from 'axios';
export default async function getData() {
const response = await axios.get('http://someapi.com/');
return response.data;
}
Run Code Online (Sandbox Code Playgroud)
然后我将使用这些数据......
// _app.js
import getData from './getData';
import App, { Container } from "next/app";
class MyApp extends App {
static async getInitialProps() {
const response = await getData();
if (response) {
return { response };
}
return {};
}
render() {
const { Component, response } = this.props;
<Container>
<Component {...this.props} data={response} /> …Run Code Online (Sandbox Code Playgroud) const {
DEVELOPMENT_SERVER,
PRODUCTION_BUILD
} = require("next/constants");
require('dotenv').config()
const path = require('path')
const Dotenv = require('dotenv-webpack')
const nextConfig = {
webpack: config => ({ ...config, node: { fs: "empty" } })
};
module.exports = phase => {
if (phase === DEVELOPMENT_SERVER || phase === PRODUCTION_BUILD) {
const withCSS = require("@zeit/next-css");
return withCSS(nextConfig);
}
return nextConfig;
};
*module.exports = {
webpack: (config) => {
config.plugins = config.plugins || []
config.plugins = [
...config.plugins,
// Read the .env file
new Dotenv({
path: …Run Code Online (Sandbox Code Playgroud)我想从构建文件夹 (.next) 启动我的 NextJS 项目。我运行next build命令,得到 .next 文件夹,然后...我多次尝试从 .next 文件夹启动项目,并使用了很多方法,但没有成功。谁能解释一下从构建文件夹启动 NextJS 项目需要做什么?
根据 Next.js 文档,您需要在keynext.config.js下声明环境变量env,以便在构建时读取它们:
env: {
GOOGLE_ANALYTICS_ID: process.env.GOOGLE_ANALYTICS_ID
},
Run Code Online (Sandbox Code Playgroud)
这在我的本地环境中正常工作,变量被隐藏_NEXT_DATA,我仍然可以从客户端访问它们。问题是在将应用程序部署到生产环境时,它无法再从process.env. 有人遇到过这个问题吗?注意:我不想暴露敏感数据。NEXT_PUBLIC_向环境变量添加前缀_NEXT_DATA是否也会暴露它们?
在新next/script组件中,我们有以下策略:
afterInteractive(默认):用于在页面交互后可以获取并执行的脚本,例如标签管理器和分析。这些脚本被注入到客户端并在水合后运行。
lazyOnload:对于可以在空闲时间等待加载的脚本,例如聊天支持和社交媒体小部件
这两个定义看起来很相似,它们有何不同?
我有这个 cartSlice,我想通过使用 cookie 作为初始状态来保留购物车,但问题是,如果我将 useSelector 调用到我的组件,则返回值是一个空对象。cookie 在那里,但我不知道为什么它没有被使用。useSelector 的返回值是一个空对象。
大车
[
{
"cartItem": {
"id": "628a1738fd8299ae6659d994",
"category": "chair",
"name": "chair",
"image": "https://res.cloudinary.com/dpxoclpym/image/upload/v1658125036/product-images/chair/chair-beige_02_at0trj.png",
"color": "beige",
},
"itemQuantity": 1,
"quantity": 1
},
{
"cartItem": {
"id": "628a1738fd8299ae6659d994",
"category": "chair",
"name": "chair",
"image": "https://res.cloudinary.com/dpxoclpym/image/upload/v1658141184/product-images/chair/chair-navy_02_rrpazi.png",
"color": "navy",
},
"itemQuantity": 1,
"quantity": 1
}
]
Run Code Online (Sandbox Code Playgroud)
购物车切片
import { createSlice } from '@reduxjs/toolkit';
import Cookies from 'js-cookie';
const cartItem = Cookies.get('cartItems')
? JSON.parse(Cookies.get('cartItems'))
: [];
const cartSlice = createSlice({
name: 'cart',
initialState: {
cart: cartItem,
quantity: 1, …Run Code Online (Sandbox Code Playgroud) 当我尝试启动 next.js 时,Node 12.0.0 在 Windows 10 x64(内部版本 17134)上崩溃(:
#
# Fatal error in , line 0
# Check failed: U_SUCCESS(status).
#
#
#
error Command failed with exit code 3221225477.
Run Code Online (Sandbox Code Playgroud)
我回滚到节点 11.14.0 并且它工作正常。
是否有修复,或者只是一个很快就会修复的错误?
next.js 的问题
Module not found: Can't resolve 'dns' in '/Users/Austin/node_modules/pg/lib'
Could not find files for /index in .next/build-manifest.json
ModuleNotFoundError: Module not found: Error: Can't resolve 'dns' in '/Users/Austin/node_modules/pg/lib'
Run Code Online (Sandbox Code Playgroud)
我很难理解这个错误信息。我正在使用 next.js 并尝试创建不同的网页。我将启动该程序,运行 npm run dev,它首先会给我以下信息:
[ wait ] starting the development server ...
[ info ] waiting on http://localhost:3000 ...
[ ready ] compiled successfully - ready on http://localhost:3000
[ wait ] compiling ...
[ ready ] compiled successfully - ready on http://localhost:3000
Run Code Online (Sandbox Code Playgroud)
然后给我这个错误。这个错误是什么意思?我在网上找到了不同的答案,但到目前为止都没有奏效。
我只是想知道如何使用<Image>Next.js 中的组件让图像拥有自己的高度和宽度,而不是自己定义高度和宽度?
我正在将旧堆栈移至下一个 js,我需要一些帮助。
我有一个 php 后端,每次更改路由时我想从该后端检查控制器,并且我想在服务器端执行此操作。
为了改变路线,我使用Link了next-routes,它只对客户端有效。
有什么方法可以在不刷新应用程序的情况下调用服务器端的控制器吗?