fix render

config/webpack.common.js

@@ -23,6 +23,7 @@ module.exports = (options) => {
       'js/app':                       './src/client/js/app',
       'js/admin':                     './src/client/js/admin',
       'js/installer':                 './src/client/js/installer',
+      'js/login':                     './src/client/js/login',
       'js/legacy':                    './src/client/js/legacy/crowi',
       'js/legacy-presentation':       './src/client/js/legacy/crowi-presentation',
       'js/plugin':                    './src/client/js/plugin',

src/client/js/login.jsx

@@ -0,0 +1,20 @@
+import React from 'react';
+import ReactDOM from 'react-dom';
+import { I18nextProvider } from 'react-i18next';
+
+import i18nFactory from './util/i18n';
+
+import LoginForm from './components/LoginForm';
+
+const i18n = i18nFactory();
+
+// render loginForm
+const loginFormElem = document.getElementById('login-form');
+if (loginFormElem) {
+  ReactDOM.render(
+    <I18nextProvider i18n={i18n}>
+      <LoginForm />
+    </I18nextProvider>,
+    loginFormElem,
+  );
+}

src/server/views/login.html

@@ -18,7 +18,9 @@
 {% block sidebar %}
 {% endblock %}
 
-
+{% block html_additional_headers %}
+  <script src="{{ webpack_asset('js/login.js') }}" defer></script>
+{% endblock %}
 
 {% block layout_main %}
 
@@ -27,6 +29,7 @@
   <div class="row">
     <div class="col-md-12">
       <div id="login-form">
+      </div>
       <!-- <div class="login-header mx-auto">
         <div class="logo mb-3">{% include 'widget/logo.html' %}</div>
         <h1>{{ appService.getAppTitle() }}</h1>
@@ -382,7 +385,6 @@
           </div>
         </div>
       </div> -->
-    </div>
   </div>
 </div>