Я возиться с использованием react-snap для предварительного рендеринга моего нового блога, и все работает довольно фантастически, за исключением нескольких вещей.
По какой-то причине в заголовки были включены сценарии, но я смог применить атрибуты async к этим сценариям, так что это было не так уж и сложно. Но потом я понял, что нет оснований для того, чтобы большинство моих сценариев были включены в первую очередь ...
В блоге нет динамического контента, это всего лишь CSS / HTML, и я использовал React только для упрощения разработки - однако, у меня есть библиотеки Markdown, все еще включенные в HTML, а также react-dom, react-router и некоторые другие.
Учитывая этот package.json:
"scripts": {
"build": "TS_NODE_PROJECT='tsconfig-webpack.json' webpack --mode production",
"dev": "TS_NODE_PROJECT='tsconfig-webpack.json' webpack-dev-server --mode development --hot",
"format": "prettier --write \"{./**/*.{ts,js,json,scss,css,less,md}*, !(node_modules)/**/*}\"",
"postbuild": "react-snap",
"test": "jest",
"testing": "jest --watch"
},
"reactSnap": {
"inlineCss": true,
"sourceMaps": false,
"asyncScriptTags": true
}
В нижней части всех моих предварительно созданных постов у меня есть:
<script async src="/runtime.d0e50ef7a54258c04b4b.js" type="text/javascript"></script>
<script async src="/npm.highlight.js.948b8c6fe7c6dff967e6.js" type="text/javascript"></script>
<script async src="/npm.remark-parse.752d87940c4e3c27644f.js" type="text/javascript"></script>
<script async src="/npm.js-yaml.38d965a6b2c1867313a0.js" type="text/javascript"></script>
<script async src="/npm.date-fns.e514c2b76cfb0e33eae1.js" type="text/javascript"></script>
<script async src="/npm.react-router.38c6735027e6ab8d92dc.js" type="text/javascript"></script>
<script async src="/npm.react-dom.43e459d17b017d4525f7.js" type="text/javascript"></script>
<script async src="/npm.buffer.03943cd6611cbaf46bd8.js" type="text/javascript"></script>
<script async src="/npm.esprima.485b4b9d10b5eb3bd8f0.js" type="text/javascript"></script>
<script async src="/vendors~main.f2266dc8cae4f4636b15.js" type="text/javascript"></script>
<script async src="/main.e3335690c0cf73e2a36c.js" type="text/javascript"></script>
НО! (За исключением, возможно, highlight.js) ни один из них не используется!
Примечание: я знаю, что размещение файлов JS внизу тела и пометка их async может быть избыточным / ненужным, но по какой-то причине после привязки эти файлы JS иногда помещаются в заголовок (у меня есть Понятия не имею, почему) - поэтому для обеспечения безопасности работы я react-snap помечаю их как асинхронные.
Можно ли как-то просто остановить включение каких-либо / всех / некоторых моих файлов JS? Я знаю, что могу сделать это вручную или с помощью некоторой постобработки на более чем 100 статьях, но я чувствую, что это также должно быть частью кукловода или ответной реакции.
РЕДАКТИРОВАТЬ: Вздох ... Как обычно, хотя я искал это раньше, через 5 минут после публикации SO сообщения - я натолкнулся на частичный ответ: removeScriptTags: true в react-snap package.json
Это удовлетворяет случаю, когда я хочу удалить ВСЕ мои скрипты, однако есть ли частичное решение? Например, допустим, я хочу превратить этот блог в PWA - и, таким образом, может потребоваться регистрация работника службы (или, возможно, я столкнулся с другим вариантом использования, где мне нужно 1-2 файла JS)