switching to webpack

index-dev.html

@@ -51,8 +51,8 @@
     <script src="src/tinode.js"></script>
     <!-- the application -->
     <script src="/firebase-init.js"></script>
-    <script type="text/babel" src="src/webapp.jsx"></script>
-    <script type="text/babel">
+    <script type="text/babel" src="src/index.js"></script>
+    <!--script type="text/babel">
       ReactDOM.render(
         <IntlProvider
           locale={navigator.language}>
@@ -60,6 +60,6 @@
         </IntlProvider>,
         document.getElementById('mountPoint')
       );
-    </script>
+    </script-->
   </body>
 </html>

package.json

@@ -3,12 +3,15 @@
   "description": "Tinode messenger for the web",
   "version": "0.15.8-rc1",
   "devDependencies": {
-    "babel-cli": "^6.26.0",
+    "@babel/core": "^7.1.2",
+    "@babel/preset-env": "^7.1.0",
+    "@babel/preset-react": "^7.0.0",
+    "babel-loader": "^8.0.4",
     "babel-plugin-react-intl": "^3.0.1",
-    "babel-preset-env": "^1.7.0",
-    "babel-preset-react": "^6.24.1",
     "cssnano": "^4.0.5",
-    "uglify-es": "^3.3.9"
+    "uglify-es": "^3.3.9",
+    "webpack": "^4.22.0",
+    "webpack-cli": "^3.1.2"
   },
   "repository": {
     "type": "git",
@@ -20,11 +23,12 @@
     "build:dev": "browserify ./src/index.js --standalone Webapp > ./umd/index.dev.js",
     "build:babel": "babel ./src/webapp.jsx --out-file ./src/webapp.es5.js",
     "build:css": "postcss css/base.css > css/base.min.css",
+    "wpbuild": "webpack --config webpack.config.js",
     "vers": "echo \"{\\\"version\\\": \\\"`node -p -e \"require('./package.json').version\"`\\\"}\" > version.json"
   },
   "files": [
     "src/index.js",
-    "src/webapp.jsx",
+    "src/components/*.jsx",
     "umd/index.prod.js",
     "umd/index.dev.js",
     "audio/msg.mp3",
@@ -39,8 +43,6 @@
     "img/badge96.png",
     "index-dev.html",
     "index.html",
-    "index.js",
-    "index.min.js",
     "manifest.json",
     "service-worker.js",
     "firebase-init.js",

src/components/create-account-view.jsx

@@ -3,8 +3,8 @@
 import React from 'react';
 
 import AvatarUpload from './avatar-upload.jsx';
-import CheckBox './checkbox.jsx';
-import VisiblePassword './visible-password.jsx';
+import CheckBox from './checkbox.jsx';
+import VisiblePassword from './visible-password.jsx';
 
 export default class CreateAccountView extends React.PureComponent {
   constructor(props) {

src/index.js

@@ -1,9 +1,9 @@
 // Put all packages together.
 // Used to generate umd/index.prod.js
 
-var React = require('react');
-var ReactDOM = require('react-dom');
-var TinodeWeb = require('./webapp.es5.js');
+import React from 'react';
+import ReactDOM from 'react-dom';
+import TinodeWeb from './components/tinode-web.jsx';
 
 ReactDOM.render(
   React.createElement(TinodeWeb, null),