[wip] add server to serve app

This commit is contained in:
vrde 2015-06-08 15:24:58 +02:00
parent 38ab68b599
commit a1bfbb8f86
8 changed files with 59 additions and 30 deletions

View File

@ -15,6 +15,9 @@ var sass = require('gulp-sass');
var concat = require('gulp-concat');
var _ = require('lodash');
var eslint = require('gulp-eslint');
var argv = require('yargs').argv;
var server = require('./server.js').app;
var config = {
bootstrapDir: './node_modules/bootstrap-sass'
@ -23,17 +26,20 @@ var config = {
gulp.task('build', function() {
bundle(false);
});
gulp.task('serve', ['browser-sync', 'lint:watch', 'sass', 'sass:watch', 'copy'], function() {
gulp.task('serve', ['browser-sync', 'run-server', 'lint:watch', 'sass', 'sass:watch', 'copy'], function() {
bundle(true);
});
gulp.task('run-server', function() {
server.listen(4000);
});
gulp.task('browser-sync', function() {
browserSync({
server: {
baseDir: "."
},
port: process.env.PORT || 3000
files: ['build/css/*.css', 'build/js/*.js'],
proxy: 'http://localhost:4000',
port: 3000
});
});
@ -47,7 +53,7 @@ gulp.task('sass', function () {
}).on('error', sass.logError))
.pipe(sourcemaps.write('./maps'))
.pipe(gulp.dest('./build/css'))
.pipe(browserSync.stream());;
.pipe(browserSync.stream());
});
gulp.task('sass:watch', function () {
@ -55,13 +61,13 @@ gulp.task('sass:watch', function () {
});
gulp.task('copy', function () {
var files = [
var staticAssets = [
'./fonts/**/*',
'./img/**/*'
];
gulp.src(files, {base: './'})
.pipe(gulp.dest('build'));
gulp.src(staticAssets, {base: './'})
.pipe(gulp.dest('./build'));
gulp.src(config.bootstrapDir + '/assets/fonts/**/*')
.pipe(gulp.dest('./build/fonts'));
@ -86,7 +92,7 @@ gulp.task('lint:watch', function () {
function bundle(watch) {
var bro;
if (watch) {
bro = watchify(browserify('./js/app.js',
// Assigning debug to have sourcemaps
@ -101,11 +107,11 @@ function bundle(watch) {
debug: true
});
}
bro.transform(babelify.configure({
compact: false
}));
function rebundle(bundler, watch) {
return bundler.bundle()
.on('error', notify.onError('Error: <%= error.message %>'))
@ -115,9 +121,9 @@ function bundle(watch) {
loadMaps: true
})) // loads map from browserify file
.pipe(sourcemaps.write()) // writes .map file
.pipe(gulp.dest('./build'))
.pipe(gulp.dest('./build/js'))
.pipe(browserSync.stream());
}
return rebundle(bro);
}
}

View File

@ -6,11 +6,11 @@
<title>ascribe</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="//brick.a.ssl.fastly.net/Source+Sans+Pro:400,600,700,900">
<link rel="stylesheet" href="build/css/main.css">
<link rel="stylesheet" href="/static/css/main.css">
</head>
<body>
<div id="main" class="container"></div>
<div id="modal" class="container"></div>
<script src="build/app.js"></script>
<script src="/static/js/app.js"></script>
</body>
</html>

View File

@ -47,7 +47,7 @@ fetch.defaults({
}
});
Router.run(routes, Router.HashLocation, (AscribeApp) => {
Router.run(routes, Router.HistoryLocation, (AscribeApp) => {
React.render(
<AscribeApp />,
document.getElementById('main')

View File

@ -46,8 +46,8 @@ let Image = React.createClass({
this.inject('http://code.jquery.com/jquery-2.1.4.min.js')
.then(() =>
Promise.all([
this.inject('node_modules/shmui/shmui.css'),
this.inject('node_modules/shmui/jquery.shmui.js')
this.inject('/static/thirdparty/shmui/shmui.css'),
this.inject('/static/thirdparty/shmui/jquery.shmui.js')
]).then(() => { window.jQuery('.shmui-ascribe').shmui(); }));
},

View File

@ -38,7 +38,7 @@ let Header = React.createClass({
return (
<Navbar>
<Nav>
<a className="navbar-brand" href="#">
<a className="navbar-brand" href="/">
<span>ascribe </span>
<span className="glyph-ascribe-spool-chunked ascribe-color"></span>
</a>

View File

@ -4,7 +4,10 @@
"description": "Das neue web client for Ascribe",
"main": "js/app.js",
"scripts": {
"lint": "eslint ./js"
"lint": "eslint ./js",
"postinstall": "npm run build",
"build": "gulp build --production",
"start": "node server.js"
},
"author": "Ascribe",
"license": "Copyright",
@ -33,12 +36,14 @@
"reactify": "^1.1.0",
"vinyl-buffer": "^1.0.0",
"vinyl-source-stream": "^1.1.0",
"watchify": "^3.1.2"
"watchify": "^3.1.2",
"yargs": "^3.10.0"
},
"dependencies": {
"alt": "^0.16.5",
"classnames": "^1.2.2",
"es6-promise": "^2.1.1",
"express": "^4.12.4",
"isomorphic-fetch": "^2.0.2",
"object-assign": "^2.0.0",
"react": "^0.13.2",

View File

@ -1,10 +1,10 @@
@font-face {
font-family: 'ascribe';
src:url('../../fonts/ascribe.eot?-oi6ttk');
src:url('../../fonts/ascribe.eot?#iefix-oi6ttk') format('embedded-opentype'),
url('../../fonts/ascribe.woff?-oi6ttk') format('woff'),
url('../../fonts/ascribe.ttf?-oi6ttk') format('truetype'),
url('../../fonts/ascribe.svg?-oi6ttk#ascribe') format('svg');
src:url('/static/fonts/ascribe.eot?-oi6ttk');
src:url('/static/fonts/ascribe.eot?#iefix-oi6ttk') format('embedded-opentype'),
url('/static/fonts/ascribe.woff?-oi6ttk') format('woff'),
url('/static/fonts/ascribe.ttf?-oi6ttk') format('truetype'),
url('/static/fonts/ascribe.svg?-oi6ttk#ascribe') format('svg');
font-weight: normal;
font-style: normal;
}
@ -52,4 +52,4 @@
@font-face {
font-family: mercury_light;
src: url(Mercury_Light.otf);
}
}

18
server.js Normal file
View File

@ -0,0 +1,18 @@
var express = require('express');
var app = express();
app.use('/static/js', express.static(__dirname + '/build/js'));
app.use('/static/css', express.static(__dirname + '/build/css'));
app.use('/static/fonts', express.static(__dirname + '/build/fonts'));
app.use('/static/thirdparty/', express.static(__dirname + '/node_modules'));
app.get(/.*/, function(req, res) {
res.sendFile(__dirname + '/index.html');
});
if (require.main === module) {
app.listen(process.env.PORT || 4000);
}
module.exports.app = app;