Feature: using webpack instead of wro

This commit is contained in:
fecaille
2016-03-31 09:36:13 +02:00
parent 1c00864580
commit fe4cfcc962
14 changed files with 200 additions and 264 deletions

View File

@@ -1,5 +1,10 @@
'use strict';
var React = require('react'),
ReactDOM = require('react-dom'),
marked = require('marked'),
$ = require('jquery');
var Comment = React.createClass({
rawMarkup: function() {
var rawMarkup = marked(this.props.children.toString(), {sanitize: true});
@@ -57,6 +62,7 @@ var CommentForm = React.createClass({
);
}
});
var CommentBox = React.createClass({
getInitialState: function() {
return {data: this.props.data || []};
@@ -120,4 +126,11 @@ var CommentList = React.createClass({
</div>
)
}
});
});
module.exports = {
CommentBox: CommentBox,
CommentList: CommentList,
CommentForm: CommentForm,
Comment: Comment
};

View File

@@ -1,4 +1,14 @@
var renderClient = function (comments) {
"use strict";
var React = require('react'),
ReactDOM = require('react-dom'),
ReactDOMServer = require('react-dom/server'),
CommentBox = require('./app.jsx').CommentBox;
require('bootstrap/dist/css/bootstrap.css');
global.renderClient = function (comments) {
var data = comments || [];
ReactDOM.render(
<CommentBox data={data} url="/api/comments" pollInterval={2000}/>,
@@ -6,9 +16,10 @@ var renderClient = function (comments) {
);
};
var renderServer = function (comments) {
global.renderServer = function (comments) {
var data = Java.from(comments);
return React.renderToString(
return ReactDOMServer.renderToString(
<CommentBox data={data} url="/api/comments" pollInterval={2000} />
);
};
};

View File

@@ -1,6 +1,8 @@
var global = this;
var global = window = this;
var console = {};
console.debug = print;
console.warn = print;
console.log = print;
var console = {
debug: print,
warn: print,
log: print,
error: print
};

View File

@@ -0,0 +1,7 @@
"use strict";
var React = require('react'),
ReactDOM = require('react-dom'),
$ = require('jquery');
require('bootstrap/dist/css/bootstrap.css');

View File

@@ -1,10 +1,10 @@
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head lang="en">
<meta charset="UTF-8" />
<title>Comments channel</title>
<link rel="stylesheet" href="/css/react-bootstrap.css" />
<link rel="stylesheet" href="/css/comments.css" />
<meta charset="UTF-8" />
<title>Comments channel</title>
<link rel="stylesheet" href="/css/vendors.bundle.js.css" />
<link rel="stylesheet" href="/css/comments.css" />
</head>
<body>
@@ -16,10 +16,8 @@
<div th:replace="fragments/footer"></div>
<script src="/js/react-bootstrap.js"></script>
<script src="/js/comments.js"></script>
<script src="/js/app.js"></script>
<script src="/js/app.render.js"></script>
<script src="/js/vendors.bundle.js"></script>
<script src="/js/app.bundle.js"></script>
<script th:inline="javascript">
var initialData = JSON.parse(/*[[${data}]]*/ '[]');
renderClient(initialData);