• Как проксировать запросы к API?

    Aetae
    @Aetae Куратор тега JavaScript
    Тлен
    При использовании postman ничего проксировать не надо, он делает запросы без ограничений. Т.о. ошибки у вас возникают не по этой причине, а из-за кривых запросов и\или кривого сервера. Пытайтесь дальше.

    P.S. Ограничения есть в браузере, если вы будете писать клиентское приложение то изучить, что такое CORS вам придётся в любом случае.
    Ответ написан
    Комментировать
  • Как сделать такую маску в CSS?

    Aetae
    @Aetae
    Тлен
    clip-path прекрасно умеет скруглять, rtfm.

    Вот через фильтр, когда-то похожее делал:

    Принцип прост: размываешь подложку через feGaussianBlur, делаешь края снова резкими через ComponentTransfer альфа-канала. В твоём случае ещё stroke и drop-shadow наверное понадобятся, сам смотри.

    ...upd: из интереса нафигачил без фильтров:

    Всё возможно.:)

    Поигрался пут с фильтром, вот версия фильтр + простой clip-path, поддерживает полупрозрачность фона, полупрозрачность бордера и тень:

    clip-path'ом вырезаем простые квадраты, фильтром закругляем. Фильтр можно в принципе применять к любому набору элементов. Версия не последняя, есть шероховатости, может ещё когда-нить потыкаю ещё.:)
    Ответ написан
    5 комментариев
  • Как решить проблему с узкой шириной текста возле float элементов?

    Aetae
    @Aetae
    Тлен
    Накидал такую хрень, с использованием трюка с распоркой и тюка с translate:
    (потыкай в 0.5x\1x)
    Работает только если ширина контейнера известна(здесь 100vw).

    Но хз, на самом деле, наверное на js будет проще.:)
    Ответ написан
    2 комментария
  • Почему данные не реактивны?

    Aetae
    @Aetae Куратор тега Vue.js
    Тлен
    В vue 2 добавленые после создания ключи объектов не реактивы из-за технических ограничений. (Раньше это большими буквами в доках писалось).
    Надо использовать this.$set \ Vue.set при добавлении нового ключа.

    В твоём случае можно переделать так:
    const templates = reactive(keyBy(templatesArr, 'id'))
    for (let templateId in templates) {
      const devices = devicesArr.filter(device => device.templateId === templateId)
      Vue.set(templates[templateId], 'devices', devices);
      Vue.set(templates[templateId], 'settings', {});
    }
    
    // либо просто так:
    const templates = keyBy(templatesArr, 'id');
    for (let templateId in templates) {
      const devices = devicesArr.filter(device => device.templateId === templateId)
      Object.assign(templates[templateId], { devices }, {settings: {}})
    }
    reactive(templates);


    P.S. не помню чтоб в vue 2 было reactive, вместо него был Vue.observable. Но может добавили, хз, лень смотреть.:)
    Ответ написан
    Комментировать
  • Как убрать ненужную всплывающюю подсказку?

    Aetae
    @Aetae Куратор тега JavaScript
    Тлен
    Поставь <form> атрибут novalidate чтоб не вылезали стандартные подсказки браузера.
    Ответ написан
  • Как запретить видеть владельцам Wifi когда я в сети и на каких сайтах?

    Aetae
    @Aetae
    Тлен
    могут ли они видеть на каких сайтах я сижу?
    Могут, если сильно захотят. Это не стандартная опция для пользовательского сегмента, но при желании и щепотке красноглазия - всё возможно.

    как тогда избежать этого?
    Только VPN(или любой иной шифрованный туннель).

    возможно ли запретить им видеть когда я сижу на их инете
    Только если держать VPN соединение поднятым постоянно, при этом гоняя по нему паразитный трафик примерно равный твоему обычному потреблению - иначе тупо по пику трафика легко будет понять.
    Если дошло до этого - проще свисток купить и сидеть через свою личную мобильную сеть.
    Ответ написан
    5 комментариев
  • Каков наилучший способ v-bind для :hover :active и тд, и можно ли вообще так сделать?

    Aetae
    @Aetae Куратор тега Vue.js
    Тлен
    Вопрос по большому счёту не относится к vue.

    Решения:
    1. Использовать класс-модификатор, который порасит как надо.
    <template>
      <input class="hover--red"/>
    </template>
    
    <style>
    .hover--red:hover {
      color: #f00
    }
    </style>

    2. Использовать css (не путать с scss) переменные.
    <script setup>
    // ...
    const hoverColor = '#f00'
    </script>
    
    <template>
      <input :style="{'--hover-color': hoverColor}"/>
    </template>
    
    <style>
    input:hover {
      color: var(--hover-color)
    }
    </style>


    ...upd: совсем забыл про такую фичу vue:
    3. Если стили лежат в sfc можно использовать переменные через v-bind в <style>:
    <script setup>
    // ...
    const hoverColor = '#f00'
    </script>
    
    <template>
      <input />
    </template>
    
    <style>
    input:hover {
      color: v-bind(hoverColor)
    }
    </style>

    А забыл я про неё потому, что категорически против такого смешения кода и стилей. Но я не могу вам запретить.:)
    Ответ написан
    1 комментарий
  • Как использовать withDefaults с вложенными обьектами (typescript)?

    Aetae
    @Aetae Куратор тега Vue.js
    Тлен
    Значения по умолчанию для этого не предназначены.
    Сделай computed значение в которым смежри входящее с дефалтным как тебе нвдо.
    Ответ написан
    Комментировать
  • Как убрать "Property does not exist on type" в рекурсивном интерфейсе?

    Aetae
    @Aetae Куратор тега TypeScript
    Тлен
    На каждом уровне проверять, что значение не string и не number. Иначе никак, ты сам задал такой тип, и ts не даст тебе совершить ошибку.

    Если у тебя только 2 уровня, то не надо рекурсии:
    interface CSS {
        [k: string]: {
            [k: string]: string | number 
        }
    }


    Если ты хочешь сузить тип при создании констатны, можно сделать так:
    const css = {
        default: {
            color: '#676767',
            border: '1px solid',
            border_color: '#C4C4C4',
            border_radius: '110px',
    
            padding: '16px 21px',
        }
    } satisfies CSS;
    Ответ написан
    Комментировать
  • Как сделать так, чтобы input был по центру?

    Aetae
    @Aetae
    Тлен
    Еслиб буковка была не цветной - можно было бы какой-нить inputmask посоветовать. Оно бы из коробки всё работало.
    Подозреваю, что где-то на просторах есть библиотека и для цветной буковки, но в целом алгоритм такой:
    Делаешь input с text-align: center и text-indent: -<размер буковки/2>.
    Скриптом к нему абсолютно цепляешь div с pointer-events:none и копией стилей input, в котором прозрачный span с дублируемым введённым текстом(input.oninput) + span с раскрашенной буковкой.
    Также следишь, чтоб input всегда был шире текста.
    Ответ написан
    Комментировать
  • Как установить cpu-features?

    Aetae
    @Aetae
    Тлен
    Проблема со сбором бинарников(не-js) под твою ноду+систему. Есть два решения: простое и сложное.
    Простое: откатывайся на предыдущую lts версию ноды, пока оно не установится(под lts версии и типичные системы обычно есть готовые сборки - до той версии до которой у пакета была поддержка).
    Сложный: установить глобально windows-build-tools и надеяться что сборка сработает. Если нет - долго и мучительно гуглить темы по сборке под винду.
    ...upd: посмотрел сейчас - wbt deprecated, теперь считается, что достаточно тулз ставится с самой нодой, т.е. тебе надо переустановить node в процессе проставив галочку "Automatically install the necessary tools". А дальше всё также молиться что оно соберётся.
    Ответ написан
    Комментировать
  • Как исправить конфликт слияния?

    Aetae
    @Aetae
    Тлен
    Ну английским же языком написано, что пакет охренел и зачем-то хочет версию ноды >=20(не 18.20, а 20). Либо обновляйте ноду в пайплане, с риском что отвалится куча иного, либо делайте даунгрейд vue3-toastify, либо форк vue3-toastify, либо пропишите --ignore-engines (или типо того) параметр к install(с риском багов).

    Конкретно для работы vue3-toastify 20ая нода нафиг не нужна, просто автор хипстер, использующий pnpm последних версий.
    Ответ написан
  • Для чего refresh токен нужен?

    Aetae
    @Aetae
    Тлен
    Это настройка конкретного сервера. Обычно рефреш живёт дольше основного токена, но ничто не мешает ставить рандомные времена истечения.

    Почему вообще нужны два токена, а не один? [Много техического бла-бла-бла, которое сможешь сам нагуглить], подытоживая: потому что второй - костыль для первого и такая технология завоевала популярность.
    Ответ написан
  • Почему ответ post запроса в консоли браузера содержит больше информации?

    Aetae
    @Aetae
    Тлен
    Ответ очевиден. То что ты видишь через вкладку сеть и через пуфон - это то, что на самом деле отдаёт сервер.
    То что ты видишь в консоли - это обогащённые скриптом данные. Либо неявно - в самой функции, которая отвечает за запрос данных, либо где-то потом в коде самого приложения. Объекты которые ты логируешь в консоле хранятся как и во всём js - по ссылке, т.е. разворачивая объект ты видишь данные в нём а момент разворота, а не на момент логирования.
    Ответ написан
    Комментировать
  • Почему не отображается картинка в SVG на GitHub?

    Aetae
    @Aetae
    Тлен
    Оно подключается как <img>, а внутри img многие фишки svg не работают, в т.ч., видимо, и отдельно подгружаемая image. Если очень хочется - впихни картинку как data uri прям в svg.
    P.S. Анимации тоже работать не будут.
    Ответ написан
    2 комментария
  • Почему не работают алиасы?

    Aetae
    @Aetae Куратор тега TypeScript
    Тлен
    paths в tsconfig - это чисто справочная информация для подсветки, добавленная из расчёта, что вы уже используете какой-то сборщик который такие пути умеет.
    Сам по себе он влияет точно и исключительно на подсветку, нужны сторонние сборщики и\или модули.
    Это by design и wont fix.

    Предполагаемое разработчиками решение: взять какой-ниь vite или webpack и настроить там руками точно такие же алиасы.
    Популярный костыль, который сделает это за тебя для любых вариантов, в том числе и ts-node: tsconfig-paths
    Ответ написан
    Комментировать
  • Как с помощью JS организовать запись и чтение данных?

    Aetae
    @Aetae Куратор тега JavaScript
    Тлен
    GM_setValue GM_getValue - будут храниться в сторе самого расширения.

    Всякие куки, localStorage, indexedDb - всё может почитститься самом сайтом или случайно тобой.

    Надёжнее - только свой сервак завести и к нему запросами отправлять-получать.:)
    Ответ написан
    Комментировать
  • Как для возвращаемого типа функции задать типы входных параметров Function[]?

    Aetae
    @Aetae Куратор тега TypeScript
    Тлен
    Как-то так, если по красоте:
    type Returns<T extends readonly Function[]> = {
      -readonly [K in keyof T]: T[K] extends (...args: any[]) => PromiseLike<infer R> ? R : never;
    };
    
    type Arguments<T extends readonly Function[]> = {
      [K in keyof T]?: T[K] extends (args: infer R, ...a: any[]) => any ? R : never;
    };
    
    function fetchAll<T extends readonly Function[]>(functions: readonly [...T], data?: Arguments<T>): Promise<Returns<T>> {
      return Promise.all(
        functions.map((func, index) => func(data?.[index]))
      ) as Promise<Returns<T>>;
    }
    
    const x = fetchAll([
      (a:66) => Promise.resolve(42),
      (f:string) => Promise.resolve('hello'),
      () => Promise.resolve(true),
    ], [66, '1ff']);


    Если надо отельный массив, то придётся его руками const:
    const arr = [
      (a:66) => Promise.resolve(42),
      (f:string) => Promise.resolve('hello'),
      () => Promise.resolve(true),
    ] as const;
    
    const x = fetchAll(arr, [66, '1ff']);
    Ответ написан
    4 комментария
  • Перед тем как изучить Vue 3, стоит ли изучать Vue 2?

    Aetae
    @Aetae Куратор тега Vue.js
    Тлен
    Изучать vue 2 стоит только если проект на нём. К сожалёнию vue 3 его уже убил.

    Однако мне есть, что вам посоветовать, с чем встречаются все новички: в vue 3 есть composition api и есть options api. И они работают вместе. НО. Их не надо использовать вместе. Никогда. Если есть setup - не должно быть, например, methods и наоборот. Это вопрос чистоты кода и мышления в одной парадигме.
    Если у вас что-то не получается в одном варианте, что кажется можно легко решить в другом - это говорит только о том, что у вас проблемы с пониманием, и лучше будет задать вопрос тут, чем разводить говнокод.
    Ответ написан
    Комментировать
  • Почему не собирается проект из за PrismaAdapter?

    Aetae
    @Aetae Куратор тега TypeScript
    Тлен
    Ошибка возникает не у тебя, а в стороннем коде модуля next-auth.
    Заигнорить это можно указав skipLibCheck в tsconfig.
    Однако лучше, по возможности, разобраться: причиной может быть что ты используешь слишком старую версию typecript, или старую версию модуля, или случайно подключаешь несколько версий модуля одновременно, или ещё много куда менее вероятных вариантов.
    Ответ написан