Я пытаюсь прочитать и понять исходный код zustand и обнаружил этот код в < a href="https://github.com/pmndrs/zustand/blob/main/src/index.ts" rel="nofollow noreferrer">index.ts

export * from './vanilla'
export * from './react'
export { default as createStore } from './vanilla'
export { default } from './react'

В чем смысл строк 3 и 4? Я подумал, что это может быть возможность импортировать функции в обоих направлениях, таким образом

import create from 'zustand'

И так

import { create } from 'zustand'

Но второй import выдает ошибку:

Module '"zustand"' has no exported member 'create'. Did you mean to use 'import create from "zustand"' instead?

РЕДАКТИРОВАТЬ: я знаю, что мне нужно сделать, чтобы правильно импортировать функцию создания. Я просто не понимаю, зачем index.ts нужны строки 3 и 4. Каковы последствия этого.

0
Kerim Güney 1 Окт 2022 в 21:47
import { create } from 'zustand' должно быть import { createStore } from 'zustand'. Или, если вы хотите переименовать его, import { createStore as create } from 'zustand'
 – 
Nicholas Tower
1 Окт 2022 в 21:50
Меня действительно интересует функция create, как описано здесь. Я просто не совсем уверен, в чем смысл строк 3 и 4 index.ts.
 – 
Kerim Güney
1 Окт 2022 в 21:58
create экспортируется как default из ./react. А в index он импортируется из ./react и реэкспортируется также как default. Вот что заставляет import create from 'zustand' работать. Строка над ней заставляет import { createStore } from 'zustand' работать.
 – 
CherryDT
1 Окт 2022 в 22:08

1 ответ

Лучший ответ

Что это значит:

export { default as createStore } from './vanilla'

Is - он берет экспорт по умолчанию из этого файла и экспортирует его в этот файл под именем createStore.

Что это значит:

export { default } from './react'

Is - он берет экспорт по умолчанию из этого файла и в этом файле экспортирует его по умолчанию.

Без строк 3 и 4 описанное выше не произошло бы — здесь не будет реэкспортироваться ни дефолтный экспорт из vanilla, ни react. (выполнение export * from только реэкспорта названных экспортов)

create не является именованным экспортом в файлах vanilla или react, и ни строки 3, ни 4 не создают экспорт с именем create, поэтому import { create } from 'zustand' (который пытается для получения экспорта с именем create) не разрешено.

При употреблении zustand, чтобы импортировать стандартный экспорт ванили, вам нужно будет сделать

import { createStore } from 'zustand';
// this can be renamed when importing with `as` if desired

Чтобы импортировать экспорт React по умолчанию, вам нужно сделать

import create from 'zustand';
// this can be named whatever you want, since it's a default import

Если бы строки 3 и 4 не существовали, ни один из этих двух приведенных выше фрагментов не работал бы, потому что экспорт по умолчанию из react и vanilla не был бы реэкспортирован.

2
CertainPerformance 1 Окт 2022 в 21:58