Как получить пользовательские свойства с помощью функцииsolveConfig при использовании Tailwind CSS

Мотивация и использование

Я разрабатываю плагин TailwindCSS, и мне нужно создать вспомогательную функцию, которая обслуживает объект конфигурации, в том числе те, которые поступают из плагина, из файла Tailwind.config.js. Для этого существуют вспомогательные функции, такие как config() или theme(); однако эта вспомогательная функция находится за пределами программы и должна иметь возможность обслуживать объект конфигурации в глобальной области.

О документации:
В документации Tailwind указана вспомогательная функция solveConfig в таких ситуациях.

Чтобы упростить эту задачу, Tailwind предоставляет помощникsolveConfig, который вы можете использовать для создания полностью объединенной версии вашего объекта конфигурации.

Однако эта функция дает мне объект конфигурации Tailwind по умолчанию, который не содержит никаких пользовательских ключей — ключей, предоставляемых плагином.

Что я пробовал

Это, конечно, не работает:

import resolve from "tailwindcss/resolveConfig.js"
import config from "path/to/config.js" with { type: "json" }
console.info(resolve(config)) // logs the default tailwind config file

Фактический код:

import resolveConfig from "tailwindcss/resolveConfig.js"
import * as configFile from "../../tailwind.config.js"
import resolveObject from "./resolve-object.js"

function getConfigFile(path?: string) {
    const config = resolveConfig(configFile)
    if (!path) return config

    return resolveObject({ object: config, path: path })
}

export { getConfigFile }

РазрешитьОбъект
getConfigFile() тоже не работает, поэтому это не имеет отношения и можете пропустить.

type ResolveObjectProps = {
    object: { [key: string]: any },
    path: string
}

function resolveObject({ object, path }: ResolveObjectProps) {
    if (!path.includes("."))
        return object[path]

    let segments = path.split(".")
    const segment = segments.shift()

    if (typeof segment !== "undefined") {
        return resolveObject({ object: object[segment], path: segments.join(".") })
    }

    return object
}

export default resolveObject
export type { ResolveObjectProps }

Нетехнические: Я могу использовать для этого fs или асинхронную функцию с динамическим импортом, или миллиард других способов, но я не уверен, действительно ли это ошибка пользователя или попутный ветер, который очищает экспортированный объект по умолчанию перед его возвратом, или, может быть,solveConfig просто возвращает значение по умолчанию. объект конфигурации попутного ветра, если это такая ситуация, то какова цель первого параметраsolveConfig?

хаха чувак удалил свои комментарии и на выходе оставил минус

dogakorkmaz 14.07.2024 00:28
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
1
1
50
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Я думаю, resolveConfig не предназначен для получения пользовательского объекта конфигурации. Смотрите решение ниже

import defaultConfig from "tailwindcss/defaultConfig.js"
import resolveConfig from "tailwindcss/resolveConfig.js"
import configFileObject from "../../tailwind.config.mjs"
import resolveObject from "./resolve-object.js"
import { deepmerge } from "deepmerge-ts"

function getConfig(path?: string) {
    const config = deepmerge(
        resolveConfig(defaultConfig),
        configFileObject
    )

    if (!path) return config

    return resolveObject({ object: config, path: path })
}

export { getConfigFile }

Другие вопросы по теме