Febbweiss/springboot-react-webpack
1
0
Fork 0
mirror of https://github.com/Febbweiss/springboot-react-webpack.git synced 2026-03-04 22:25:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

Optim: populate html template with resource links and hash

Browse Source
This commit is contained in:
fecaille
2016-03-31 16:22:15 +02:00
parent 2115d30c32
commit 6251fcf075
6 changed files with 66 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
package.json
View File

@@ -17,6 +17,8 @@
"css-loader": "^0.23.1", "css-loader": "^0.23.1",
"extract-text-webpack-plugin": "^1.0.1", "extract-text-webpack-plugin": "^1.0.1",
"file-loader": "^0.8.5", "file-loader": "^0.8.5",
"html-loader": "^0.4.3",
"html-webpack-plugin": "^2.15.0",
"postcss-loader": "^0.8.2", "postcss-loader": "^0.8.2",
"style-loader": "^0.13.1", "style-loader": "^0.13.1",
"url-loader": "^0.5.7", "url-loader": "^0.5.7",

13
src/main/java/com/opengroupe/cloud/saas/Application.java
View File

@@ -2,7 +2,8 @@ package com.opengroupe.cloud.saas;
import org.springframework.boot.SpringApplication; import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication; import org.springframework.boot.autoconfigure.SpringBootApplication;
import org.springframework.boot.autoconfigure.security.oauth2.client.EnableOAuth2Sso; import org.springframework.context.annotation.Bean;
import org.thymeleaf.templateresolver.ServletContextTemplateResolver;
//@EnableOAuth2Sso //@EnableOAuth2Sso
@SpringBootApplication @SpringBootApplication
@@ -11,4 +12,14 @@ public class Application {
public static void main(String[] args) { public static void main(String[] args) {
SpringApplication.run(Application.class, args); SpringApplication.run(Application.class, args);
} }
@Bean
public ServletContextTemplateResolver templateResolver() {
ServletContextTemplateResolver resolver = new ServletContextTemplateResolver();
resolver.setPrefix("/templates/");
resolver.setSuffix(".html");
resolver.setTemplateMode("LEGACYHTML5");
resolver.setCacheable(false);
return resolver;
}
} }

4
src/main/resources/static/js/app.render.jsx
View File

@@ -5,6 +5,7 @@ import React from 'react';
import ReactDOM from 'react-dom'; import ReactDOM from 'react-dom';
import ReactDOMServer from 'react-dom/server'; import ReactDOMServer from 'react-dom/server';
import App from './app.jsx'; import App from './app.jsx';
import $ from 'jquery';
require('bootstrap/dist/css/bootstrap.css'); require('bootstrap/dist/css/bootstrap.css');
@@ -25,3 +26,6 @@ global.renderServer = function (comments) {
); );
}; };
if( !global.nashorn ) {
renderClient(initialData);
};

2
src/main/resources/static/js/nashorn-polyfill.js
View File

@@ -1,5 +1,7 @@
var global = window = this; var global = window = this;
global.nashorn = true;
var console = { var console = {
debug: print, debug: print,
warn: print, warn: print,

20
src/main/resources/templates/index-template.html Normal file
View File

@@ -0,0 +1,20 @@
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head lang="en">
<meta charset="UTF-8" />
<title>Comments channel</title>
</head>
<body>
<div th:replace="fragments/header"></div>
<div class="container">
<div id="content" th:utext="${markup}"></div>
</div>
<div th:replace="fragments/footer"></div>
<script th:inline="javascript">
var initialData = JSON.parse(/*[[${data}]]*/ '[]');
</script>
</body>
</html>

37
webpack.config.js
View File

@@ -1,15 +1,16 @@
var path = require('path'), var path = require('path'),
webpack = require('webpack'), webpack = require('webpack'),
CommonsChunkPlugin = require("webpack/lib/optimize/CommonsChunkPlugin"), CommonsChunkPlugin = require("webpack/lib/optimize/CommonsChunkPlugin"),
ExtractTextPlugin = require("extract-text-webpack-plugin"); ExtractTextPlugin = require("extract-text-webpack-plugin"),
HtmlWebpackPlugin = require('html-webpack-plugin');
var source_dir = __dirname + '/src/main/resources/static/js', var source_dir = __dirname + '/src/main/resources/static',
node_dir = __dirname + '/node_modules'; node_dir = __dirname + '/node_modules';
var config = { var config = {
entry: { entry: {
app: [source_dir + '/app.render'], app: [source_dir + '/js/app.render'],
vendors: [source_dir + '/vendors'] vendors: [source_dir + '/js/vendors']
}, },
resolve: { resolve: {
extensions: ['', '.js', '.jsx', '.css'] extensions: ['', '.js', '.jsx', '.css']
@@ -18,12 +19,19 @@ var config = {
cache: true, cache: true,
debug: true, debug: true,
output: { output: {
path: './target/classes/static/js', path: './target/classes/static',
filename: '[name].bundle.js' filename: 'js/[name].bundle.js',
publicPath: '/'
}, },
plugins: [ plugins: [
new ExtractTextPlugin("../css/[name].css"), new ExtractTextPlugin("css/[name].css"),
new CommonsChunkPlugin("vendors", null, true), new CommonsChunkPlugin("vendors", null, true),
new HtmlWebpackPlugin({
template: path.join(__dirname, 'src/main/resources/templates/index-template.html'),
filename: '../templates/index.html',
xhtml: true,
hash: true
})
], ],
module: { module: {
loaders: [ loaders: [
@@ -42,24 +50,31 @@ var config = {
}, },
{ {
test: /\.eot(\?v=\d+\.\d+\.\d+)?$/, test: /\.eot(\?v=\d+\.\d+\.\d+)?$/,
loader: "file?name=../css/[name].[ext]" loader: "file?name=font/[name].[ext]"
}, },
{ {
test: /\.(woff|woff2)$/, test: /\.(woff|woff2)$/,
loader:"url?prefix=font/&limit=5000&name=../css/[name].[ext]" loader:"url?prefix=font/&limit=5000&name=font/[name].[ext]"
}, },
{ {
test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/, test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/,
loader: "url?limit=10000&mimetype=application/octet-stream&&name=../css/[name].[ext]" loader: "url?limit=10000&mimetype=application/octet-stream&&name=font/[name].[ext]"
}, },
{ {
test: /\.svg(\?v=\d+\.\d+\.\d+)?$/, test: /\.svg(\?v=\d+\.\d+\.\d+)?$/,
loader: "url?limit=10000&mimetype=image/svg+xml&&name=../css/[name].[ext]" loader: "url?limit=10000&mimetype=image/svg+xml&&name=font/[name].[ext]"
},
{
test: /\.html$/,
loader: 'html-loader?minimize=false'
} }
] ]
}, },
postcss: function () { postcss: function () {
return []; return [];
},
htmlLoader: {
removeAttributeQuotes: false,
} }
}; };