Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[bug] theme can't resolve fonts #237

Closed
TFK70 opened this issue Mar 8, 2021 · 4 comments · Fixed by #238 or #247
Closed

[bug] theme can't resolve fonts #237

TFK70 opened this issue Mar 8, 2021 · 4 comments · Fixed by #238 or #247
Assignees

Comments

@TFK70
Copy link
Contributor

TFK70 commented Mar 8, 2021

Описание бага

  1. @atlantis-lab/theme@latest
  2. Пакет неверно резолвит путь до шрифтов
  3. Есть ошибка в globals.ts

Воспроизведение

Шаги для воспроизведения бага:

  1. Инициализируем тему с помощью текущего пакета
  2. Кладем туда шрифты
  3. Видим ошибку, шрифты не подгружаются
  4. При попытке использования injectGlobalStyles нас просят предоставить все 3 аргумента

Ожидаемое поведение

Путь до шрифтов должен резолвиться корректно

injectGlobalStyles должен запрашивать один обязательный аргумент - fontFaces. Остальные два - опциональные (у них есть initial value)

Материалы

Error: Cannot find module '../fonts/Courier-bold.woff' from 'utils.js'
        at Resolver.resolveModule (/media/darius/6E4CBE7A4CBE3D21/atlantis/atlantis/ui/uikit/node_modules/jest-resolve/build/index.js:259:17)
        at Resolver._getVirtualMockPath (/media/darius/6E4CBE7A4CBE3D21/atlantis/atlantis/ui/uikit/node_modules/jest-resolve/build/index.js:390:14)
        at Resolver._getAbsolutePath (/media/darius/6E4CBE7A4CBE3D21/atlantis/atlantis/ui/uikit/node_modules/jest-resolve/build/index.js:376:14)
        at Resolver.getModuleID (/media/darius/6E4CBE7A4CBE3D21/atlantis/atlantis/ui/uikit/node_modules/jest-resolve/build/index.js:348:31)
        at Runtime._shouldMock (/media/darius/6E4CBE7A4CBE3D21/atlantis/atlantis/ui/uikit/node_modules/jest-runtime/build/index.js:942:37)
        at Runtime.requireModuleOrMock (/media/darius/6E4CBE7A4CBE3D21/atlantis/atlantis/ui/uikit/node_modules/jest-runtime/build/index.js:595:16)
        at fontFace (/media/darius/6E4CBE7A4CBE3D21/atlantis/atlantis/ui/uikit/packages/theme/node_modules/@atlantis-lab/theme/dist/utils.js:11:18)
        at /media/darius/6E4CBE7A4CBE3D21/atlantis/atlantis/ui/uikit/packages/theme/node_modules/@atlantis-lab/theme/dist/utils.js:17:32
        at Array.forEach (<anonymous>)
        at Object.<anonymous>.exports.injectFontFaces (/media/darius/6E4CBE7A4CBE3D21/atlantis/atlantis/ui/uikit/packages/theme/node_modules/@atlantis-lab/theme/dist/utils.js:15:57) {
      code: 'MODULE_NOT_FOUND'
    }

Данные окружения

@TFK70 TFK70 added the bug label Mar 8, 2021
@TFK70 TFK70 self-assigned this Mar 8, 2021
TFK70 pushed a commit that referenced this issue Mar 8, 2021
affects: @atlantis-lab/theme

- Added additional fontsPath prop in injectGlobalStyles
- Changed props order

ISSUES CLOSED: #237
@TFK70
Copy link
Contributor Author

TFK70 commented Mar 11, 2021

@TorinAsakura проблема
Суть в том, что тот метод резолва путей до шрифтов который используется сейчас ориентирован на то, что место, где используется injectGlobalStyles - конечное, и стили инжектятся прямо там. Но это не так, ведь на проектах мы после инициализации темы еще устанавливаем ее как отдельную зависимость, а стили инжектятся в например app, но никак не в самом пакете темы. Это значит, что тема будет искать шрифты отталкиваясь от папки, где был вызван injectGlobalStyles, а не там, где находится сама тема

Подробнее:
Есть проект. В нем есть пакет @ui/theme. Мы инициализируем тему, используя текущий API injectGlobalStyles, указывая релятивные пути до шрифтов. Если посмотреть лог прямо там, внутри темы, мы увидим что все корректно.

Теперь, вне ui создаем страницу. На этой странице, непосредственно, нам необходимо заинжектить глобальные стили. Мы устанавливаем @ui/theme как зависимость, и он ищет шрифты прямо там, в папке, где находится страница.

В итоге задача такая:

  1. @atlantis-lab/theme должен резолвить пути до шрифтов за своими пределами (в условном @ui/theme)
  2. Этот условный @ui/theme должен резолвить пути до шрифтов уже внутри себя, прямо в нод модулях когда он устанавливается как зависимость

@TFK70 TFK70 reopened this Mar 11, 2021
@TorinAsakura
Copy link
Member

@TFK70 не используй формулировки в духе "сделать так", учись формулировать

@TorinAsakura
Copy link
Member

@TFK70 и да, я тебе уже про это говорил, когда речь заходила о шрифтах

@TFK70
Copy link
Contributor Author

TFK70 commented Mar 11, 2021

@TorinAsakura ну вообще прекрасно
Еще поищу как это можно без шаманств с вебпаком реализовать, если можно. Мне такое решение вообще не нравится, что-то крутить в вебпаке чтобы использовать шаблон темы - слишком сильная головная боль, очевидно

TFK70 pushed a commit that referenced this issue Mar 17, 2021
affects: @atlantis-lab/theme

ISSUES CLOSED: #237
@TFK70 TFK70 reopened this Mar 23, 2021
TFK70 pushed a commit that referenced this issue Oct 2, 2021
affects: @atlantis-lab/theme

- Added additional fontsPath prop in injectGlobalStyles
- Changed props order

ISSUES CLOSED: #237
TFK70 pushed a commit that referenced this issue Oct 2, 2021
affects: @atlantis-lab/theme

ISSUES CLOSED: #237
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
2 participants