-
Notifications
You must be signed in to change notification settings - Fork 59
Поддержка PWA #181
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
base: master
Are you sure you want to change the base?
Поддержка PWA #181
Changes from 3 commits
f6529f6
2041b6d
1bfe492
60f8587
067efce
d401f21
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,5 +1,6 @@ | ||
| const withSourceMaps = require('@zeit/next-source-maps') | ||
| const withCSS = require('@zeit/next-css') | ||
| const withPWA = require('next-pwa') | ||
|
|
||
| const withMDX = require('@next/mdx')({ | ||
| extension: /\.(md|mdx)$/, | ||
|
|
@@ -11,7 +12,17 @@ const withMDX = require('@next/mdx')({ | |
| module.exports = withCSS( | ||
| withMDX( | ||
| withSourceMaps( | ||
| { pageExtensions: ["md", "mdx", "tsx"] } | ||
| withPWA( | ||
| { | ||
| pageExtensions: ["md", "mdx", "tsx"], | ||
| pwa: { | ||
| dest: 'public', | ||
| modifyURLPrefix: { | ||
|
Owner
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Не нашёл в документации упоминания этой настройки; за что она отвечает?
Owner
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Ещё я заметил, что в офлайне доступны сразу все страницы. С одной стороны — это хорошо, потому что можно единожды загрузить и читать «в метро». С другой — это занимает 2,5 MB JS при скачивании, и, возможно, для мобильных это расточительно. Может быть, стоит настроить “cache-as-you-go”, но я не уверен, что оно того стоит. Что думаете, @dex157, @bkoshelev? 🤔 |
||
| 'static/': '_next/static/', | ||
| } | ||
| } | ||
| } | ||
| ) | ||
| ) | ||
| ) | ||
| ) | ||
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -29,6 +29,7 @@ export default class MyDocument extends Document<IProps> { | |
| <link rel="icon" type="image/png" sizes="32x32" href="/favicon/favicon-32x32.png" /> | ||
| <link rel="icon" type="image/png" sizes="16x16" href="/favicon/favicon-16x16.png" /> | ||
| <link rel="mask-icon" href="/favicon/safari-pinned-tab.svg" color="#f8364c" /> | ||
| <link rel='manifest' href='/favicon/site.webmanifest' /> | ||
|
Owner
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Надо будет обновить расположение манифеста или папку переименовать, а то как-то странно, что в Это не замечание к этому PR, а скорее вопрос ко мне и моему коду. Я подумаю об этом в фоллоу-апе. |
||
| <meta name="msapplication-TileColor" content="#f8364c" /> | ||
| <meta name="theme-color" content="#ffffff" /> | ||
|
|
||
|
|
||
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Не нашёл в документации упоминания этой настройки; за что она отвечает?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
next-pwa создает свой список файлов в файле /public/sw.js. При сборке проекта, он сохраняет к себе url каждого файла, лежащего в папке .next/static (ссылка каждого файла имеет вид /static/*).
Затем, при сборке html файла каждой страницы, в теге script к url каждого файла в начало добавляется префикс _next/
next-pwa не знает про этот префикс и добавляет url в свой список "как есть", из-за чего потом service worker пытается обратиться к файлу по неверному пути.
в пакете ранее уже был код, который добавляет префикс (shadowwalker/next-pwa@384a513#diff-e727e4bdf3657fd1d798edcd6b099d6e092f8573cba266154583a746bba0f346L226), но он был удален в версии 5.0.0. (возможно, в новых версиях next.js или webpack уже нет необходимости в этом префиксе)
Параметр modifyURLPrefix добавляет необходимый префикс при сборке файла sw.js.
Этот параметр не упоминается в документации, но упоминание о нем есть в одном из issue shadowwalker/next-pwa#12
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Ага, я понял. Спасибо за объяснение!
Вероятно, стоит зависимости обновить тогда, чтобы не использовать незадокументированных решений в коде. (Если, конечно, оно работает «из коробки» со свежей версией Next.)
Думаю, можно будет это отдельной задачей сделать и запихнуть в фоллоу-ап.