mirror of
https://github.com/elyby/emails-renderer.git
synced 2024-11-16 18:23:23 +05:30
Implement cli mode
This commit is contained in:
parent
7e618b23df
commit
bfcf4971f6
@ -20,7 +20,7 @@
|
|||||||
"test": "karma start ./karma.conf.js",
|
"test": "karma start ./karma.conf.js",
|
||||||
"lint": "eslint ./src",
|
"lint": "eslint ./src",
|
||||||
"i18n": "cd ./scripts && ./node_modules/.bin/babel-node i18n-collect.js",
|
"i18n": "cd ./scripts && ./node_modules/.bin/babel-node i18n-collect.js",
|
||||||
"build": "rm -rf dist/ && webpack --progress --colors -p",
|
"build": "rm -rf dist/ && NODE_ENV=production webpack --progress --colors",
|
||||||
"render": ""
|
"render": ""
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
|
7
src/emails/register/Register.jsx
Normal file
7
src/emails/register/Register.jsx
Normal file
@ -0,0 +1,7 @@
|
|||||||
|
export default function Register({username}) {
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
You Have Been Registered, {username}!
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
3
src/emails/register/index.js
Normal file
3
src/emails/register/index.js
Normal file
@ -0,0 +1,3 @@
|
|||||||
|
import Register from './Register';
|
||||||
|
|
||||||
|
export default Register;
|
30
src/index.js
30
src/index.js
@ -2,12 +2,34 @@ import 'babel-polyfill';
|
|||||||
|
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import ReactDOM from 'react-dom';
|
import ReactDOM from 'react-dom';
|
||||||
|
import ReactDOMServer from 'react-dom/server';
|
||||||
|
|
||||||
import { IntlProvider } from 'react-intl';
|
import { IntlProvider } from 'react-intl';
|
||||||
|
|
||||||
ReactDOM.render(
|
import Register from 'emails/register';
|
||||||
|
|
||||||
|
const isCli = typeof window === 'undefined';
|
||||||
|
|
||||||
|
const App = ({type, payload = {}}) => (
|
||||||
<IntlProvider locale="en" messages={{}}>
|
<IntlProvider locale="en" messages={{}}>
|
||||||
<div>Hello world</div>
|
{isCli
|
||||||
</IntlProvider>,
|
? (
|
||||||
document.getElementById('app')
|
<Register {...payload} />
|
||||||
|
) : (
|
||||||
|
<div>
|
||||||
|
Hello world
|
||||||
|
<Register {...payload} />
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
</IntlProvider>
|
||||||
);
|
);
|
||||||
|
|
||||||
|
if (isCli) {
|
||||||
|
module.exports = {
|
||||||
|
default: (props) =>
|
||||||
|
ReactDOMServer.renderToStaticMarkup(<App {...props} />)
|
||||||
|
};
|
||||||
|
} else {
|
||||||
|
ReactDOM.render(<App />, document.getElementById('app'));
|
||||||
|
}
|
||||||
|
@ -1,19 +1,17 @@
|
|||||||
/* eslint-env node */
|
/* eslint-env node */
|
||||||
|
|
||||||
var path = require('path');
|
const path = require('path');
|
||||||
|
|
||||||
var webpack = require('webpack');
|
const webpack = require('webpack');
|
||||||
var loaderUtils = require('loader-utils');
|
const loaderUtils = require('loader-utils');
|
||||||
var ExtractTextPlugin = require('extract-text-webpack-plugin');
|
const ExtractTextPlugin = require('extract-text-webpack-plugin');
|
||||||
var HtmlWebpackPlugin = require('html-webpack-plugin');
|
const HtmlWebpackPlugin = require('html-webpack-plugin');
|
||||||
var cssUrl = require('webpack-utils/cssUrl');
|
const cssUrl = require('webpack-utils/cssUrl');
|
||||||
var cssImport = require('postcss-import');
|
const cssImport = require('postcss-import');
|
||||||
|
|
||||||
var vendor = Object.keys(require('./package.json').dependencies);
|
|
||||||
|
|
||||||
const rootPath = path.resolve('./src');
|
const rootPath = path.resolve('./src');
|
||||||
|
|
||||||
const isProduction = process.argv.some((arg) => arg === '-p');
|
const isProduction = process.env.NODE_ENV === 'production';
|
||||||
|
|
||||||
process.env.NODE_ENV = isProduction ? 'production' : 'development';
|
process.env.NODE_ENV = isProduction ? 'production' : 'development';
|
||||||
|
|
||||||
@ -48,14 +46,16 @@ const cssLoaderQuery = {
|
|||||||
|
|
||||||
var webpackConfig = {
|
var webpackConfig = {
|
||||||
entry: {
|
entry: {
|
||||||
app: path.join(__dirname, 'src'),
|
app: path.join(__dirname, 'src')
|
||||||
vendor: vendor
|
|
||||||
},
|
},
|
||||||
|
|
||||||
|
target: isProduction ? 'node' : 'web',
|
||||||
|
|
||||||
output: {
|
output: {
|
||||||
path: path.join(__dirname, 'dist'),
|
path: path.join(__dirname, 'dist'),
|
||||||
publicPath: '/',
|
publicPath: '/',
|
||||||
filename: '[name].js?[hash]'
|
filename: isProduction ? '[name].js' : '[name].js?[hash]',
|
||||||
|
libraryTarget: isProduction ? 'commonjs' : undefined
|
||||||
},
|
},
|
||||||
|
|
||||||
resolve: {
|
resolve: {
|
||||||
@ -92,22 +92,13 @@ var webpackConfig = {
|
|||||||
new HtmlWebpackPlugin({
|
new HtmlWebpackPlugin({
|
||||||
template: 'src/index.ejs',
|
template: 'src/index.ejs',
|
||||||
favicon: 'src/favicon.ico',
|
favicon: 'src/favicon.ico',
|
||||||
hash: isProduction,
|
|
||||||
filename: 'index.html',
|
filename: 'index.html',
|
||||||
inject: false,
|
inject: false
|
||||||
minify: {
|
|
||||||
collapseWhitespace: isProduction
|
|
||||||
}
|
|
||||||
}),
|
}),
|
||||||
new webpack.ProvidePlugin({
|
new webpack.ProvidePlugin({
|
||||||
// window.fetch polyfill
|
React: 'react'
|
||||||
fetch: 'imports?this=>self!exports?self.fetch!whatwg-fetch'
|
})
|
||||||
}),
|
],
|
||||||
new webpack.optimize.CommonsChunkPlugin('vendor', 'vendor.js?[hash]')
|
|
||||||
].concat(isProduction ? [
|
|
||||||
new webpack.optimize.DedupePlugin(),
|
|
||||||
new webpack.optimize.UglifyJsPlugin()
|
|
||||||
] : []),
|
|
||||||
|
|
||||||
module: {
|
module: {
|
||||||
loaders: [
|
loaders: [
|
||||||
|
Loading…
Reference in New Issue
Block a user