aljaz/ttyd
1
1
Fork 0
mirror of https://github.com/tsl0922/ttyd.git synced 2025-12-22 11:54:19 +01:00
Code Issues Packages Projects Releases Wiki Activity

html: add development server

Browse Source
This commit is contained in:
Shuanglei Tao
2018-05-02 23:27:50 +08:00
parent 2d78f5c6a5
commit 68b58829cd
9 changed files with 3148 additions and 448 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
html/README.md
View File

@@ -1,10 +1,12 @@
# Building the inlined html
## Prerequisites
install [Yarn](https://yarnpkg.com), then run the following commands:
install [Yarn](https://yarnpkg.com), and run: `yarn install`.
```bash
yarn
yarn run build
```
## Development
this will compile the inlined html to `../src/index.html`.
1. Start ttyd: `ttyd bash`
2. Start the dev server: `yarn run start`
## Publish
Run `yarn run build`, this will compile the inlined html to `../src/index.html`.

18
html/gulpfile.js
View File

@@ -1,18 +1,14 @@
const gulp = require('gulp'),
inlinesource = require('gulp-inline-source'),
webpack = require('webpack-stream');
clean = require('gulp-clean'),
inlinesource = require('gulp-inline-source');
gulp.task('webpack', function() {
return gulp.src([
'js/app.js',
'sass/app.scss'
])
.pipe(webpack(require('./webpack.config.js')))
.pipe(gulp.dest('dist/'));
gulp.task('clean', function () {
return gulp.src('dist', {read: false})
.pipe(clean());
});
gulp.task('inlinesource', ['webpack'], function () {
return gulp.src('index.html')
gulp.task('inlinesource', function () {
return gulp.src('dist/index.html')
.pipe(inlinesource())
.pipe(gulp.dest('../src/'));
});

2
html/index.html
View File

@@ -5,7 +5,6 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>ttyd - Terminal</title>
<link inline rel="icon" type="image/png" href="favicon.png">
<link inline href="dist/bundle.css">
</head>
<body>
<div id="terminal-container"></div>
@@ -42,6 +41,5 @@
</div>
</div>
<script src="auth_token.js"></script>
<script inline src="dist/bundle.js"></script>
</body>
</html>

2
html/js/app.js
View File

@@ -1,3 +1,5 @@
require('../sass/app.scss');
// polyfills for ie11
require('core-js/fn/array');
require('core-js/fn/object');

21
html/package.json
View File

@@ -10,7 +10,9 @@
"author": "Shuanglei Tao <tsl0922@gmail.com>",
"license": "MIT",
"scripts": {
"build": "gulp"
"build": "webpack --config webpack.prod.js && gulp",
"clean": "gulp clean",
"start": "webpack-serve webpack.dev.js"
},
"dependencies": {
"bulma": "^0.6.1",
@@ -20,16 +22,25 @@
"zmodem.js": "^0.1.5"
},
"devDependencies": {
"babel-core": "^6.26.0",
"babel-loader": "^7.1.2",
"babel-core": "^6.26.3",
"babel-loader": "^7.1.4",
"babel-preset-env": "^1.6.1",
"copy-webpack-plugin": "^4.5.1",
"css-loader": "^0.28.8",
"extract-text-webpack-plugin": "^3.0.2",
"gulp": "^3.9.1",
"gulp-clean": "^0.4.0",
"gulp-inline-source": "^3.1.0",
"html-webpack-inline-source-plugin": "^0.0.10",
"html-webpack-plugin": "^3.2.0",
"http-proxy-middleware": "^0.18.0",
"koa-connect": "^2.0.1",
"mini-css-extract-plugin": "^0.4.0",
"node-sass": "^4.7.2",
"sass-loader": "^6.0.6",
"style-loader": "^0.19.1",
"webpack-stream": "^4.0.0"
"webpack": "^4.6.0",
"webpack-cli": "^2.1.2",
"webpack-merge": "^4.1.2",
"webpack-serve": "^0.3.2"
}
}

34
html/webpack.config.js
View File

@@ -1,8 +1,12 @@
const ExtractTextPlugin = require("extract-text-webpack-plugin");
const CopyWebpackPlugin = require('copy-webpack-plugin');
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const devMode = process.env.NODE_ENV !== 'production';
module.exports = {
entry: './js/app.js',
output: {
filename: 'bundle.js'
path: __dirname + '/dist',
filename: devMode ? '[name].js' : '[name].[hash].js'
},
module: {
rules: [
@@ -15,22 +19,24 @@ module.exports = {
presets: ['env']
}
}
}, {
test: /\.scss$/,
use: ExtractTextPlugin.extract({
use: [{
loader: "css-loader"
}, {
loader: "sass-loader"
}],
fallback: "style-loader"
})
},
{
test: /\.s?[ac]ss$/,
use: [
devMode ? 'style-loader' : MiniCssExtractPlugin.loader,
'css-loader',
'sass-loader',
]
}
]
},
plugins: [
new ExtractTextPlugin({
filename: 'bundle.css',
new CopyWebpackPlugin([
{from: 'favicon.png', to: '.' }
], {}),
new MiniCssExtractPlugin({
filename: devMode ? '[name].css' : '[name].[hash].css',
chunkFilename: devMode ? '[id].css' : '[id].[hash].css',
})
]
}

32
html/webpack.dev.js Normal file
View File

@@ -0,0 +1,32 @@
const merge = require('webpack-merge');
const convert = require('koa-connect');
const proxy = require('http-proxy-middleware');
const config = require('./webpack.config.js');
const HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = merge(config, {
devtool: 'source-map',
mode: 'development',
plugins: [
new HtmlWebpackPlugin({
template: 'index.html'
})
],
serve: {
content: __dirname + '/dist',
add: (app, middleware, options) => {
var ttydProxy = proxy(
[
'/ws',
'/auth_token.js'
],
{
target: 'http://127.0.0.1:7681',
ws: true
}
);
app.use(convert(ttydProxy));
}
}
});

16
html/webpack.prod.js Normal file
View File

@@ -0,0 +1,16 @@
const merge = require('webpack-merge');
const config = require('./webpack.config.js');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const HtmlWebpackInlineSourcePlugin = require('html-webpack-inline-source-plugin');
module.exports = merge(config, {
mode: 'production',
plugins: [
new HtmlWebpackPlugin({
inlineSource: '.(js|css)$',
template: 'index.html'
}),
new HtmlWebpackInlineSourcePlugin()
]
});

3455
html/yarn.lock
View File

File diff suppressed because it is too large Load Diff