Commit 974d16e4 authored by kaiyou's avatar kaiyou

Switch to Webpack for resource build

parent b88985f9
{
"name": "tedimg",
"private": true,
"dependencies": {
"Materialize": "materialize#~0.97.3",
"jquery": "~2.1.4"
}
}
var gulp = require('gulp'),
bower = require('gulp-bower'),
replace = require('gulp-replace'),
concat = require('gulp-concat');
var config = {
srcPath: './resources',
bowerDir: './bower_components',
dstPath: './tedimg/static'
}
gulp.task('bower', function() {
return bower()
.pipe(gulp.dest(config.bowerDir))
});
gulp.task('styles', function () {
return gulp.src([
config.bowerDir + '/*/dist/css/*.min.css',
config.srcPath + '/main.css'
])
.pipe(concat('main.css'))
.pipe(replace("/font/", "/static/font/"))
.pipe(gulp.dest(config.dstPath))
});
gulp.task('scripts', function() {
return gulp.src([
config.bowerDir + '/jquery/dist/jquery.min.js',
config.bowerDir + '/Materialize/dist/js/materialize.min.js',
config.srcPath + '/*.js'
])
.pipe(concat('main.js'))
.pipe(gulp.dest(config.dstPath))
});
gulp.task('copy', function() {
return gulp.src(config.bowerDir + '/Materialize/dist/font/**/*')
.pipe(gulp.dest(config.dstPath + '/font'));
});


gulp.task('default', ['bower', 'styles', 'copy', 'scripts']);
Flask==0.10.1
itsdangerous==0.24
Jinja2==2.8
MarkupSafe==1.0
Pillow==3.0.0
requests==2.8.1
uWSGI==2.0.11.2
uWSGI==2.0.17
Werkzeug==0.14.1
......@@ -24,3 +24,29 @@ input.snippet {
:-ms-input-placeholder {
color: #444;
}
/* Materialize icons */
/* fallback */
@font-face {
font-family: 'Material Icons';
font-style: normal;
font-weight: 400;
src: url('https://fonts.gstatic.com/s/materialicons/v38/flUhRq6tzZclQEJ-Vdg-IuiaDsNc.woff2') format('woff2');
}
.material-icons {
font-family: 'Material Icons';
font-weight: normal;
font-style: normal;
font-size: 24px;
line-height: 1;
letter-spacing: normal;
text-transform: none;
display: inline-block;
white-space: nowrap;
word-wrap: normal;
direction: ltr;
-moz-font-feature-settings: 'liga';
-moz-osx-font-smoothing: grayscale;
}
// Import general CSS
import 'materialize-css';
import 'materialize-css/dist/css/materialize.css';
// Import specific CSS
import './main.css';
// Javascript libs
import $ from 'jquery';
$(document).ready(function() {
$("form#upload input").change(function() {
......
......@@ -4,9 +4,7 @@
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0"/>
<title>{{ config["SITE_NAME"] }}</title>
<link href="/static/main.css" type="text/css" rel="stylesheet" media="screen,projection"/>
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<script src="/static/main.js"></script>
<script src="/static/app.js"></script>
</head>
<body>
<nav class="blue" role="navigation">
......@@ -21,9 +19,8 @@
<footer class="page-footer blue">
<div class="footer-copyright">
<div class="container">
Built with <i class="material-icons tiny">favorite</i> using <a class="white-text" href="http://flask.pocoo.org/">Flask</a>,
<a class="white-text" href="http://materializecss.com/">Materialize</a> and
<a class="white-text" href="http://gulpjs.com/">Gulp</a>
Built with <i class="material-icons tiny">favorite</i> using <a class="white-text" href="http://flask.pocoo.org/">Flask</a> and
<a class="white-text" href="http://materializecss.com/">Materialize</a>
<span class="right"><i class="material-icons tiny">call_split</i> on <a class="white-text" href="https://github.com/kaiyou/tedimg">Github</a>.</a>
</div>
</div>
......
var webpack = require("webpack");
var path = require("path");
module.exports = {
mode: 'development',
entry: './resources/main.js',
output: {
filename: 'app.js',
path: path.resolve(__dirname, 'tedimg/static'),
publicPath: '/static/'
},
module: {
rules: [
{
test: /\.css$/,
use: ['style-loader', 'css-loader', 'resolve-url-loader']
},
{
test: /\.(png|woff2?)$/,
use: ['file-loader']
}
]
}
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment