1
0
mirror of https://github.com/jhillyerd/inbucket.git synced 2025-12-17 09:37:02 +00:00

ui: minimal webpack 4 build w/ proxy & hot reload

This commit is contained in:
James Hillyerd
2018-11-16 22:49:50 -08:00
parent fe20854173
commit 284dd70bc6
6 changed files with 87 additions and 23 deletions

View File

@@ -6,7 +6,7 @@ export INBUCKET_LOGLEVEL="debug"
export INBUCKET_SMTP_DISCARDDOMAINS="bitbucket.local" export INBUCKET_SMTP_DISCARDDOMAINS="bitbucket.local"
export INBUCKET_WEB_TEMPLATECACHE="false" export INBUCKET_WEB_TEMPLATECACHE="false"
export INBUCKET_WEB_COOKIEAUTHKEY="not-secret" export INBUCKET_WEB_COOKIEAUTHKEY="not-secret"
export INBUCKET_WEB_UIDIR="ui/build" export INBUCKET_WEB_UIDIR="ui/dist"
export INBUCKET_STORAGE_TYPE="file" export INBUCKET_STORAGE_TYPE="file"
export INBUCKET_STORAGE_PARAMS="path:/tmp/inbucket" export INBUCKET_STORAGE_PARAMS="path:/tmp/inbucket"
export INBUCKET_STORAGE_RETENTIONPERIOD="3h" export INBUCKET_STORAGE_RETENTIONPERIOD="3h"

24
ui/package.json Normal file
View File

@@ -0,0 +1,24 @@
{
"name": "inbucket-ui",
"version": "3.0.0",
"license": "MIT",
"private": true,
"scripts": {
"build": "webpack --mode production",
"watch": "webpack --mode development --watch",
"dev": "webpack-dev-server --mode development --port 3000",
"errors": "webpack --mode development --display-error-details"
},
"dependencies": {},
"devDependencies": {
"css-loader": "^1.0.1",
"elm-hot-webpack-loader": "^1.0.2",
"elm-webpack-loader": "^5.0.0",
"html-webpack-plugin": "^3.2.0",
"node-elm-compiler": "^5.0.1",
"style-loader": "^0.23.1",
"webpack": "^4.25.1",
"webpack-cli": "^3.1.2",
"webpack-dev-server": "^3.1.10"
}
}

View File

@@ -1,22 +1,16 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge"> <meta http-equiv="x-ua-compatible" content="ie=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="theme-color" content="#000000"> <meta name="theme-color" content="#000000">
<!-- <title>Inbucket</title>
manifest.json provides metadata used when your web app is added to the
homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/
-->
<link rel="manifest" href="%PUBLIC_URL%/manifest.json">
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.png" type="image/png">
<title>Inbucket</title>
</head> </head>
<body> <body>
<noscript> <noscript>
You need to enable JavaScript to run this app. You need to enable JavaScript to run this app.
</noscript> </noscript>
<div id="root"></div> <div id="root"></div>
</body> </body>
</html> </html>

View File

@@ -1,10 +1,10 @@
{ {
"short_name": "Elm App", "short_name": "Inbucket",
"name": "Create Elm App Sample", "name": "Inbucket",
"icons": [ "icons": [
{ {
"src": "favicon.ico", "src": "favicon.png",
"sizes": "192x192", "sizes": "16x16",
"type": "image/png" "type": "image/png"
} }
], ],

View File

@@ -1,6 +1,5 @@
import './main.css' import './main.css'
import { Elm } from './Main.elm' import { Elm } from './Main.elm'
import registerServiceWorker from './registerServiceWorker'
import registerMonitorPorts from './registerMonitor' import registerMonitorPorts from './registerMonitor'
// App startup. // App startup.
@@ -39,5 +38,3 @@ function sessionObject() {
app.ports.windowTitle.subscribe(function (title) { app.ports.windowTitle.subscribe(function (title) {
document.title = title document.title = title
}) })
registerServiceWorker()

49
ui/webpack.config.js Normal file
View File

@@ -0,0 +1,49 @@
const HtmlWebpackPlugin = require('html-webpack-plugin')
const webpack = require('webpack')
module.exports = {
mode: 'development',
output: {
filename: 'static/[name].js',
publicPath: '/',
},
module: {
rules: [
{
test: /\.elm$/,
exclude: [/elm-stuff/, /node_modules/],
use: [
{ loader: 'elm-hot-webpack-loader' },
{
loader: 'elm-webpack-loader',
options: {
debug: true
},
},
],
},
{
test: /\.css$/,
exclude: [/node_modules/],
loader: ['style-loader', 'css-loader'],
},
]
},
plugins: [
new HtmlWebpackPlugin({
template: 'public/index.html',
favicon: 'public/favicon.png',
}),
new webpack.HotModuleReplacementPlugin(),
],
devServer: {
inline: true,
hot: true,
stats: { colors: true },
proxy: [{
context: ['/api', '/debug', '/serve'],
target: 'http://localhost:9000',
ws: true,
}],
},
};