satchlj
/
joyce
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Testing webpack-dev-server

This commit is contained in:
Alex Hunt 2018-11-26 22:59:02 -08:00
parent 3298f5c932
commit 058a0adf51
13 changed files with 20 additions and 2835 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.ebignore
View File

@ -1,5 +1,3 @@
/static
!/static/style.css
/icon /icon
/node_modules /node_modules
.pytest_cache/ .pytest_cache/

13
application.py
View File

@ -1,6 +1,4 @@
from flask import Flask from flask import Flask
from flask_webpack import Webpack
from werkzeug.serving import run_simple
from blueprints.joyce import joyce from blueprints.joyce import joyce
from blueprints.api import api from blueprints.api import api
@ -8,24 +6,15 @@ from blueprints.api import api
# Initialize application # Initialize application
application = Flask(__name__) application = Flask(__name__)
WEBPACK_MANIFEST_PATH = './static/manifest.json'
params = { params = {
'ENV': 'staging', 'ENV': 'staging',
'DEBUG': True, 'DEBUG': True,
'WEBPACK_MANIFEST_PATH': WEBPACK_MANIFEST_PATH
} }
application.config.update(params) application.config.update(params)
webpack = Webpack()
webpack.init_app(application)
# Register blueprints # Register blueprints
application.register_blueprint(joyce) application.register_blueprint(joyce)
application.register_blueprint(api, url_prefix='/api') application.register_blueprint(api, url_prefix='/api')
if __name__ == "__main__": if __name__ == "__main__":
application.run() application.run()
# run_simple('localhost', 5000, application, use_reloader=True, use_debugger=True)

BIN
dist/js/674f50d287a8c48dc19ba404d20fe713.eot vendored
View File

Binary file not shown.

2671
dist/js/912ec66d7572ff821749319396470bde.svg vendored
View File

File diff suppressed because it is too large Load Diff
Side by Side

Before

Width:  |  Height:  |  Size: 434 KiB

BIN
dist/js/af7ae505a9eed503f8b8e6982036873e.woff2 vendored
View File

Binary file not shown.

BIN
dist/js/b06871f281fee6b241d60582ae9369b9.ttf vendored
View File

Binary file not shown.

BIN
dist/js/fee66e712a8a08eef5805a46892932ad.woff vendored
View File

Binary file not shown.

96
dist/js/joyce.js vendored
View File

File diff suppressed because one or more lines are too long

17
package.json
View File

@ -4,8 +4,8 @@
"description": "Reader and Editor for Hypertext", "description": "Reader and Editor for Hypertext",
"main": "app.js", "main": "app.js",
"scripts": { "scripts": {
"build": "webpack-cli --config webpack.prod.js --mode=production", "build": "rimraf static/js/ && webpack --config webpack.prod.js --mode=production",
"watch": "webpack-cli --config webpack.dev.js --watch --mode=development", "dev": "rimraf static/js/ && webpack-dev-server --hot --inline --config webpack.dev.js --mode=development",
"test": "python setup.py && jest --config jest.config.js --no-cache && python setup.py" "test": "python setup.py && jest --config jest.config.js --no-cache && python setup.py"
}, },
"author": "Alex Hunt", "author": "Alex Hunt",
@ -25,10 +25,7 @@
"react-router": "^4.2.0", "react-router": "^4.2.0",
"react-router-dom": "^4.2.2", "react-router-dom": "^4.2.2",
"react-router-redux": "^5.0.0-alpha.9", "react-router-redux": "^5.0.0-alpha.9",
"redux": "^3.7.2", "redux": "^3.7.2"
"webpack": "^4.25.1",
"webpack-bundle-analyzer": "^2.13.1",
"webpack-cli": "^3.1.2"
}, },
"devDependencies": { "devDependencies": {
"babel-core": "^6.26.0", "babel-core": "^6.26.0",
@ -37,21 +34,21 @@
"babel-preset-env": "^1.6.1", "babel-preset-env": "^1.6.1",
"babel-preset-react": "^6.24.1", "babel-preset-react": "^6.24.1",
"babel-preset-stage-3": "^6.24.1", "babel-preset-stage-3": "^6.24.1",
"clean-webpack-plugin": "^0.1.17",
"css-loader": "^0.28.7", "css-loader": "^0.28.7",
"extract-text-webpack-plugin": "^3.0.2",
"file-loader": "^1.1.11", "file-loader": "^1.1.11",
"jest": "^22.4.3", "jest": "^22.4.3",
"manifest-revision-webpack-plugin": "^0.4.1",
"node-sass": "^4.6.0", "node-sass": "^4.6.0",
"postcss-loader": "^2.0.8", "postcss-loader": "^2.0.8",
"precss": "^2.0.0", "precss": "^2.0.0",
"rimraf": "^2.6.2",
"sass-loader": "^6.0.6", "sass-loader": "^6.0.6",
"style-loader": "^0.19.0", "style-loader": "^0.19.0",
"sync-exec": "^0.6.2", "sync-exec": "^0.6.2",
"uglifyjs-webpack-plugin": "^2.0.1",
"webpack": "^4.6.0", "webpack": "^4.6.0",
"webpack-bundle-analyzer": "^2.11.1", "webpack-bundle-analyzer": "^2.11.1",
"webpack-cli": "^2.0.15", "webpack-cli": "^3.1.2",
"webpack-dev-server": "^3.1.10",
"webpack-merge": "^4.1.2" "webpack-merge": "^4.1.2"
} }
} }

8
templates/joyce.html
View File

@ -1,15 +1,13 @@
<!doctype html> <!DOCTYPE html>
<head> <head>
<title>Joyce - Reader</title> <title>Joyce - Reader</title>
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="manifest" href="static/manifest.json"> <link rel="icon" type="image/png" href="/static/image/icon.png">
<link rel="icon" href="{{ url_for('static', filename='icon.png') }}" type="image/png">
<link rel="icon" type="image/png" href="static/image/icon.png">
</head> </head>
<body> <body>
<!-- Reader Layout --> <!-- Reader Layout -->
<div id="wrapper"> <div id="wrapper">
</div> </div>
<!-- Scripts --> <!-- Scripts -->
<script src="{{asset_url_for('joyce.js')}}"></script> <script src="/static/js/joyce.js"></script>
</body> </body>

21
webpack.common.js
View File

@ -1,5 +1,3 @@
// const HtmlWebpackPlugin = require('html-webpack-plugin')
const ManifestRevisionPlugin = require('manifest-revision-webpack-plugin')
const webpack = require('webpack') const webpack = require('webpack')
const path = require('path') const path = require('path')
@ -12,6 +10,11 @@ module.exports = {
rootAssetPath + 'stylesheets/' + 'joyce.scss' rootAssetPath + 'stylesheets/' + 'joyce.scss'
] ]
}, },
output: {
publicPath: "/static/js/",
filename: '[name].js',
path: path.resolve(__dirname, 'static/js/')
},
module : { module : {
rules: [ rules: [
{ {
@ -52,7 +55,7 @@ module.exports = {
] ]
} }
}, { }, {
loader: 'sass-loader' // compiles SASS to CSS loader: 'sass-loader'
}] }]
}, },
{ {
@ -62,16 +65,4 @@ module.exports = {
}] }]
} }
]}, ]},
plugins: [
new ManifestRevisionPlugin(path.join('static/', 'manifest.json'), {
rootAssetPath: rootAssetPath
}),
// new webpack.ProvidePlugin({
// bootstrap: 'bootstrap'
// $: 'jquery',
// jQuery: 'jquery',
// 'window.jQuery': 'jquery',
// Popper: ['popper.js', 'default']
// }),
],
}; };

16
webpack.dev.js
View File

@ -1,24 +1,14 @@
const merge = require('webpack-merge'); const merge = require('webpack-merge');
const common = require('./webpack.common.js'); const common = require('./webpack.common.js');
const path = require('path')
const CleanWebpackPlugin = require('clean-webpack-plugin')
const pathsToClean = [
'static/js'
]
module.exports = merge(common, { module.exports = merge(common, {
output: { devServer: {
publicPath: "/static/js/", contentBase: '.',
filename: '[name].[hash].js', hot: true
path: path.resolve(__dirname, 'static/js/')
}, },
watch: true, watch: true,
watchOptions: { watchOptions: {
poll: true, poll: true,
ignored: /node_modules/ ignored: /node_modules/
}, },
plugins: [
new CleanWebpackPlugin(pathsToClean),
]
}); });

11
webpack.prod.js
View File

@ -1,26 +1,15 @@
const webpack = require('webpack'); const webpack = require('webpack');
const merge = require('webpack-merge'); const merge = require('webpack-merge');
const UglifyJSPlugin = require('uglifyjs-webpack-plugin'); const UglifyJSPlugin = require('uglifyjs-webpack-plugin');
const CleanWebpackPlugin = require('clean-webpack-plugin')
const common = require('./webpack.common.js'); const common = require('./webpack.common.js');
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin; const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
const path = require('path') const path = require('path')
const pathsToClean = [
'dist/js'
]
module.exports = merge(common, { module.exports = merge(common, {
output: {
publicPath: "/dist/js/",
filename: '[name].js',
path: path.resolve(__dirname, 'dist/js/')
},
optimization: { optimization: {
minimize: true minimize: true
}, },
plugins: [ plugins: [
new CleanWebpackPlugin(pathsToClean),
new UglifyJSPlugin(), new UglifyJSPlugin(),
new BundleAnalyzerPlugin, new BundleAnalyzerPlugin,
new webpack.LoaderOptionsPlugin({ new webpack.LoaderOptionsPlugin({