avatar

sunday

Sunday's Blog

  • 首页
Home next.js中使用zustand引入第三方库报错self is not defined
文章

next.js中使用zustand引入第三方库报错self is not defined

Posted 2024-01-21 Updated 2024-01- 21
By sunday
3~3 min read

nextjs 14.0.4使用zustand引用一些第三方的库时出现的self is not defined 问题

比如useExamplePKGStore

import examplePKG from "example";
const useExamplePKGStore = create((set) => ({
	data: null;
	init: ()=> {
		set({ data: new examplePKG() })
	}
}))

这时候在next的页面中引用

任意的page.js

import useExamplePKGStore from '@/app/store/useExamplePKGStore';
import { useEffect } from 'react';
const Page = () => {
	const { init } = useExamplePKGStore()
	useEffect(()=>{
		init()
    }, [])
   return <div>test</div>	
}

这时候会报self is not defined

在useExamplePKGStore.js 中改为

import examplePKG from "example";
const useExamplePKGStore = create((set) => ({
	data: null;
	init: ()=> {
       import("example").then((examplePKG) => {
		   set({ data: new examplePKG() })
       });
	}
}))

即可解决组件中报self is not defined 的问题

nextjs, 疑难杂症
nextjs
License:  CC BY 4.0
Share

Further Reading

May 3, 2025

nextjs15使用better-sqlite3的连接报错问题

1.出现如下错误 ⨯ Error: Could not locate the bindings file. Tried: 解决方法 我是使用pnpm包管理器,执行以下操作 首先安装node-gyp pnpm i node-gyp -D 然后执行 pnpm approve-builds 执行后会

Apr 6, 2025

nextjs + clerk + supabase + realtime 实时监听数据库更改

1.开启realtime.messages策略 在supabase的SQL Editor执行以下命令 create policy "Enable all access for authenticated users" on "public"."messages" as PERMISSIVE for

Mar 27, 2025

解决nextjs15使用useLocalStorage报错的问题

已经在组件中使用"use client"声明了,还是报错,错误如下: Unhandled Runtime Error Error: useLocalStorage is a client-only hook 1.解决方案1-使用 dynamic 导入 import dynamic from 'nex

OLDER

解决国内安装docker-compose很慢很卡安装不了的问题

NEWER

浏览器出现的一些跨域的问题,如何正确设置cors

Recently Updated

  • nextjs15使用better-sqlite3的连接报错问题
  • nextjs + clerk + supabase + realtime 实时监听数据库更改
  • 解决nextjs15使用useLocalStorage报错的问题
  • mac上使用nodejs appium控制chrome浏览器
  • 2024年终总结

Trending Tags

nginx acme 强制跳转HTTPS nodejs 代理 mac 神器 vue3 工具 docker

Contents

©2025 sunday. Some rights reserved.

Using the Halo theme Chirpy