Программно создайте index.html из проекта React, чтобы включить номер версии из package.json - PullRequest
0 голосов
/ 08 июня 2018

Проблема, которую я пытаюсь решить при развертывании новой сборки, пользователи должны получить самые последние bundle.js и bundle.css, а не кешированные браузером.Решением проблемы является добавление строки запроса к имени файла, например /client.bundle.js?v=1.01.1.01 происходит от свойства package.json version.

Содержимое index.html, которое содержится в общей папке, приведено ниже.Как настроить веб-пакет для автоматического изменения index.html при сборке?

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Loading...</title>
  <meta name="viewport"
    content="width=device-width,user-scalable=no,initial-scale=1">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta charset="utf-8">
  <link href="https://fonts.googleapis.com/css?family=Lato:300,400,600,700" rel="stylesheet">
  <link rel="stylesheet" type="text/css" href="/client.bundle.css">
</head>
<body>
  <div id="app"></div>
  <script src="/bundle.js"></script>
  </script>
</body>
</html>

1 Ответ

0 голосов
/ 08 июня 2018

В системе сборки Webpack вы можете использовать что-то вроде этого:

const VERSION = JSON.stringify(require('./package.json').version)

И сделать это доступным для оконного объекта через DefinePlugin Webpack

new webpack.DefinePlugin({__VERSION : VERSION})

, который вы можете использовать позже в индексе.HTML-файл или если вы используете какой-либо язык шаблонов.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...