Задать вопрос
  • Почему не отображается картинка в 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, или старую версию модуля, или случайно подключаешь несколько версий модуля одновременно, или ещё много куда менее вероятных вариантов.
    Ответ написан
  • Как добиться видимости переменной JavaScript в событии тега button?

    Aetae
    @Aetae Куратор тега JavaScript
    Тлен
    Именно в таком виде код в обычном html будет работать прекрасно. Ищи проблему в ином месте.
    // поставил true чтоб собственно вызов происходил.
    Ответ написан
    Комментировать
  • Почему не получается задать либо один тип либо другой в typescript?

    Aetae
    @Aetae Куратор тега TypeScript
    Тлен
    В action ты кладёшь функцию onClick с сигнатурой (item: LinkItem) => void, а требуется (data: MobileMegaMenuItem | LinkItem) => void, , т.е. функция которая умеет работать и с тем и с тем. Подразумевается что onClick как раз не умеет и может привести к ошибке, потому и не даёт.

    Используй дженерик чтобы вывести конкретный тип:
    export const useOpenMenuByHash = <Data extends MobileMegaMenuItem | LinkItem>(
        data: Data[],
        action: (data: Data) => void,
        actionRoom?: () => void
    ) => {
      //...
    };
    
    useOpenMenuByHash(data, onClick); // ok

    Ну или кастуй руками:
    useOpenMenuByHash(data, onClick as (d: LinkItem | MobileMegaMenuItem) => void);
    Ответ написан
    4 комментария
  • Почему возникает ошибка при использовании переменной окружения в конфиге webpack?

    Aetae
    @Aetae
    Тлен
    Потестил.
    1. Проблема с conslole.log у тебя в русской "c", о чём намекает даже подсветка тут.
    2. npm run съедает параметр --env, т.к. считает его своим, чтоб передавать аргументы в скрипт надо использовать разделитель --: npm run build -- --env mode=development.
    Ну или выкинуть убогий npm и использвать yarn\pnpm, где такой ереси нет.:)
    Ответ написан
  • Хочу сделать таблицу на vue3 которая не будет однофайловым компонентом, какой запрос вводить чтобы найти статью описывающую как это сделать?

    Aetae
    @Aetae Куратор тега Vue.js
    Тлен
    Цитата из официальной документации:
    If you prefer a plain HTML setup without any build steps, you can use this JSFiddle as your starting point.


    Вот открывать тот филдл:
    код оттуда на всякий случай
    <script type="importmap">
      {
        "imports": {
          "vue": "https://unpkg.com/vue@3/dist/vue.esm-browser.js"
        }
      }
    </script>
    
    <div id="app">{{ message }}</div>
    
    <script type="module">
      import { createApp } from 'vue'
    
      createApp({
        data() {
          return {
            message: 'Hello Vue!'
          }
        }
      }).mount('#app')
    </script>

    И делаешь также у себя.
    А дальше все статьи для однофайловых компонентов подойдут и тебе. Ну и плюс немного знания js для импорта и использования библиотек.

    Единственное, что следует помнить, это то что ты пишешь в html, а потому если в статье кто-то использует компоненты так:
    <SomeComponent :someProp=""val"/>
    то тебе надо ручками сделать так:
    <some-component :some-prop=""val"></some-component>
    Почему? Птому что 1 - html регистронезависимый и SomeComponent читается как somecomponent, а vue такого не знает, 2 - список тэгов которые могут самозакрываться ограничен.
    Ответ написан
    Комментировать
  • Не могу адекватно интегрировать шрифты Nuxt3?

    Aetae
    @Aetae
    Тлен
    Шрифты всегда и везде мерцают если не в кэше. Единственный способ надёжно избежать этого - ничего не показывать пока шрифт не загрузится - т.е. отображать лоадер или ещё что. "Не надёжно" это можно сделать просто поигравшись со свойством font-display.
    Наверняка же дождаться загрузки помогут соответствующие библиотеки, например webfontloader или напрямую Font Loading API.

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

    К сожалению из-за cache partitioning в современных браузерах использование всяких cdn для шрифтов, делу никак не поможет, т.к. для каждого сайта всё равно своё кэш.
    Ответ написан
    Комментировать
  • Как красиво использовать динамически подгружаемый API?

    Aetae
    @Aetae Куратор тега JavaScript
    Тлен
    Вот те простой хэлпер для ленивой загрузки одной функции:
    function lazyAsync(lib) {
      let promise;
      return async function (...args) {
        promise ??= lib();
    
        return (await promise).call(this, ...args);
      };
    }
    
    const doSomething = lazyAsync(async () => {
      // тут загружаем
      const doSomething = await loadLib('doSomething');
    
      // тут что-то делаем с загруженным
    
      // тут возвращаем конечную функцию
      return data => {
        // тут делаем с аргументами
        return doSomething.process(imgData);
      };
    });
    
    // если сразу загружается нужная функция - можно не усложнять
    const doSomething = lazyAsync(loadDoSomethingProcess);
    
    await doSomething(1);
    await doSomething(2);
    await doSomething(3);
    Ответ написан
    Комментировать
  • Как вложить span в textarea?

    Aetae
    @Aetae Куратор тега JavaScript
    Тлен
    Никак.
    Textarea - зона текста, там может быть только текст.
    Если хотите большего - есть только три варианта, два - геморройные, с кучей коссбраузерных несовместимостей и особенностей, которые обязательно заставят вас рвать волосы на заднице:
    1. Отказаться от textarea и использовать contentEditable div.
    2. Подкладывать под(или поверх с pointer-events:none) div, который копирует содержимое textarea 1:1 со всеми стилями и отступами и раскрашивает его как надо.

    ...и третий, рекомендуемый лично мной:
    3. Использовать одну из долгоживущих готовых библиотек, в которых всё давно отладили и предоставили удобные интерфейсы.
    Ответ написан
    3 комментария
  • Как заставить hmr в vite подключатсья по wss?

    Aetae
    @Aetae
    Тлен
    Нужно сконфигурировать nuxt devServer в режиме https из-за этого куска кода(хотя все мы понимаем что в 99% за https у нас отвечает nginx). Ну или монкипатчить.
    Ответ написан
    Комментировать
  • Как исправить ошибку TypeError: Cannot create property 'value' on boolean 'false'?

    Aetae
    @Aetae Куратор тега Vue.js
    Тлен
    Это так не работает. В шаблоне у тебя все рефы раскрыты -это шаблон, он должен быть простым.

    Делать надо либо так:
    function popupLibraryOpen() {
      isLibraryOpen.value = true
    }
    <MyButton @click="popupLibraryOpen">Библиотека игр</MyButton>

    либо так:
    <MyButton @click="isLibraryOpen = true">Библиотека игр</MyButton>
    Ответ написан
    2 комментария
  • Как пересобрать массив объектов, выкинув из него лишнее?

    Aetae
    @Aetae Куратор тега JavaScript
    Тлен
    Как-то так, если без учёта дубликатов, в один проход.
    function removeSomeShit(arr) {
      const table = {};
      const result = [];
    
      for(const current of arr) {
        const {uid, owner, createdAt} = current;
    
        const uidOvnerKey = `${uid}\0${owner}`;
        const ownerUidKey = `${owner}\0${uid}`;
    
        const matched = table[uidOvnerKey];
    
        if (matched) {
          delete table[uidOvnerKey];
          result.push(matched.createdAt > createdAt ? matched : current);
        } else {
          table[ownerUidKey] = current;
        }
      };
      
      return Object.values(table).concat(result);
    }
    Ответ написан
    1 комментарий
  • Как вывести template внутри template?

    Aetae
    @Aetae Куратор тега Vue.js
    Тлен
    а) Вынести в отдельный компонент. Чем компоненты меньше - тем лучше для vue. Не стесняйтесь выносить даже одиночный div.
    <div>
      <p>1111</p>
      <v-cost />
    </div>
    <div>
      <p>22222</p>
      <v-cost />
    </div>

    б) Если это какой-то массив данных - используйте v-for:
    <div v-for="{ title } in arr" :key="title">
      <p>{{title}}</p>
      <div class="cost">
        <div class="cost__title">test:</div>
        <div class="cost__number">3 400 </div>
      </div>
    </div>

    с) Если прям очень хочется говнять в рамках одного компонента, это можно сделать с помощью render функции, но там уже никаких шаблонов - чистый код. Тема "продвинутая", и в твоём случае явно не нужная, так разбирайся сам если хочешь.:)
    Ответ написан
    Комментировать
  • Нужно ли в vue для использования однофайловых компонентов использовать сборщик?

    Aetae
    @Aetae Куратор тега Vue.js
    Тлен
    Простой ответ: да, нужно.
    Сложный ответ: не обязательно, можно компилировать шаблоны на лету подключив полный бандл vue на страницу, а потому с использованием костылей от сторонних разработчиков или самописных, возможно будет работать и с целыми компонентами, перекладывая вычисления на сторону пользователя. Но делать так не надо.
    Ответ написан
    Комментировать
  • Почему не работают хуки с использованием createBrowserRouter?

    Aetae
    @Aetae
    Тлен
    Очевидно: element: UserAuth(), -> element: <UserAuth />,
    Ответ написан
  • Как убрать выделяющую линию в RubyMine или PHPStorm?

    Aetae
    @Aetae
    Тлен
    В PHPStorm, называется "Caret row":668c4751e495d403651189.png
    Ответ написан
    Комментировать