overflow_backup_2018_0455/deprecated_overflow_webapp
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

ing

Browse Source
This commit is contained in:
crusader 2017-12-21 14:48:31 +09:00
parent 59415bd7ac
commit cf40d0998e
6 changed files with 236 additions and 195 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

96
config/webpack/webpack.config.base.js
View File

@ -3,47 +3,59 @@ const TsConfigPathsPlugin = require('awesome-typescript-loader').TsConfigPathsPl
const packages = require('../../package.json'); const packages = require('../../package.json');
module.exports = { module.exports = {
target: 'web', target: 'web',
entry: { entry: {
webapp: [ webapp: [
Path.resolve(__dirname, '../../src/ts/@overflow/webapp/index.tsx') Path.resolve(__dirname, '../../src/ts/@overflow/webapp/index.tsx')
],
vendor: Object.keys(packages.dependencies)
},
output: {
path: Path.resolve(__dirname, '../../dist'),
filename: '[name].js',
publicPath: '/'
},
devtool: '',
resolve: {
extensions: ['.ts', '.tsx', '.js', '.json'],
plugins: [
new TsConfigPathsPlugin({
tsconfig: "tsconfig.json",
compiler: "typescript"
})
]
},
module: {
rules: [
{
test: /\.tsx?$/,
enforce: 'pre',
exclude: [
Path.resolve(__dirname, '../../node_modules/')
],
loader: 'tslint-loader',
}
]
},
plugins: [
], ],
node: { vendor: Object.keys(packages.dependencies)
fs: 'empty' },
}
output: {
path: Path.resolve(__dirname, '../../dist'),
filename: '[name].js',
publicPath: '/'
},
devtool: '',
resolve: {
extensions: ['.ts', '.tsx', '.js', '.json'],
// Fix webpack's default behavior to not load packages with jsnext:main module
// https://github.com/Microsoft/TypeScript/issues/11677
mainFields: ['browser', 'main'],
plugins: [
new TsConfigPathsPlugin({
tsconfig: "tsconfig.json",
compiler: "typescript"
})
]
},
module: {
loaders: [
{
enforce: 'pre',
test: /\.tsx?$/,
exclude: [
Path.resolve(__dirname, '../../node_modules/')
],
use: [
{
loader: 'tslint-loader'
}
],
}
]
},
plugins: [
],
node: {
// workaround for webpack-dev-server issue
// https://github.com/webpack/webpack-dev-server/issues/60#issuecomment-103411179
fs: 'empty',
net: 'empty'
}
}; };

184
config/webpack/webpack.config.dev.js
View File

@ -6,96 +6,104 @@ const WebpackDashboardPlugin = require('webpack-dashboard/plugin');
const configBase = require('./webpack.config.base.js'); const configBase = require('./webpack.config.base.js');
module.exports = WebpackMerge(configBase, { module.exports = WebpackMerge(configBase, {
entry: { // entry: {
webapp: [ // webapp: [
'react-hot-loader/patch' // 'react-hot-loader/patch'
] // ]
}, // },
devtool: 'inline-source-map', devtool: 'inline-source-map',
devServer: { devServer: {
hot: true, hot: true,
inline: true, inline: true,
historyApiFallback: true, historyApiFallback: true,
publicPath: '/', // match the output `publicPath` publicPath: '/', // match the output `publicPath`
contentBase: [__dirname + '/public', __dirname + '/dist', __dirname + '/node_modules'], // match the output path contentBase: [__dirname + '/public', __dirname + '/dist', __dirname + '/node_modules'], // match the output path
host: '127.0.0.1', host: '127.0.0.1',
port: 9091, port: 9091,
stats: { stats: {
colors: true colors: true
},
watchOptions: {
ignored: /node_modules/,
},
}, },
watchOptions: {
ignored: /node_modules/,
},
},
module: { module: {
rules: [ loaders: [
{ // source-map
enforce: 'pre', {
test: /\.js$/, enforce: 'pre',
loader: 'source-map-loader', test: /\.js$/,
exclude: [ use: [
Path.resolve(__dirname, '../../node_modules/') {
] loader: 'source-map-loader'
}, }
{ ],
enforce: 'pre', exclude: [
test: /\.tsx?$/, Path.resolve(__dirname, '../../node_modules/')
use: "source-map-loader",
exclude: [
Path.resolve(__dirname, '../../node_modules/')
]
},
// {
// test: /\.tsx?$/,
// loaders: [
// 'awesome-typescript-loader'
// ],
// exclude: [
// Path.resolve(__dirname, '../../node_modules/')
// ],
// include: [
// Path.resolve(__dirname, '../../src/')
// ]
// },
{
test: /\.tsx?$/,
exclude: [
Path.resolve(__dirname, '../../node_modules/')
],
include: [
Path.resolve(__dirname, '../../src/')
],
use: [
{
loader: 'react-hot-loader/webpack'
},
{
loader: 'awesome-typescript-loader',
options: {
transpileOnly: true,
useTranspileModule: false,
sourceMap: true,
},
},
],
},
] ]
}, },
plugins: [ {
new WebpackDashboardPlugin(), enforce: 'pre',
new Webpack.HotModuleReplacementPlugin(), test: /\.tsx$/,
new Webpack.NamedModulesPlugin(), use: [
new Webpack.NoEmitOnErrorsPlugin(), {
new HtmlWebpackPlugin({ loader: 'source-map-loader'
template: Path.resolve(__dirname, '../../public/index.html') }
}), ],
new Webpack.optimize.CommonsChunkPlugin({ exclude: [
name: 'vendor', Path.resolve(__dirname, '../../node_modules/')
minChunks: Infinity, ]
filename: 'vendor.js' },
}), // .ts, .tsx
] {
test: /\.tsx?$/,
exclude: [
Path.resolve(__dirname, '../../node_modules/')
],
include: [
Path.resolve(__dirname, '../../src/')
],
use: [
{
loader: 'react-hot-loader/webpack'
},
{
loader: 'awesome-typescript-loader',
options: {
transpileOnly: true,
useTranspileModule: false,
sourceMap: true,
},
},
]
},
// static assets
{ test: /\.html$/, use: 'html-loader' },
{ test: /\.png$/, use: 'url-loader?limit=10000' },
{ test: /\.jpg$/, use: 'file-loader' },
],
},
plugins: [
new WebpackDashboardPlugin(),
new Webpack.DefinePlugin({
'process.env.NODE_ENV': JSON.stringify('development')
}),
new Webpack.optimize.CommonsChunkPlugin({
name: 'vendor',
minChunks: Infinity,
filename: 'vendor.js'
}),
new Webpack.optimize.AggressiveMergingPlugin(),
new Webpack.HotModuleReplacementPlugin(),
new Webpack.NamedModulesPlugin(),
new Webpack.NoEmitOnErrorsPlugin(),
new HtmlWebpackPlugin({
template: Path.resolve(__dirname, '../../public/index.html')
}),
]
}); });

134
config/webpack/webpack.config.prod.js
View File

@ -5,67 +5,77 @@ const configBase = require('./webpack.config.base.js');
module.exports = WebpackMerge(configBase, { module.exports = WebpackMerge(configBase, {
devtool: 'source-map', devtool: 'source-map',
module: { module: {
rules: [ loaders: [
{ // .ts, .tsx
enforce: 'pre', {
test: /\.js$/, test: /\.tsx?$/,
loader: 'source-map-loader', exclude: [
exclude: [ Path.resolve(__dirname, '../../node_modules/')
Path.resolve(__dirname, '../../node_modules/') ],
] include: [
}, Path.resolve(__dirname, '../../src/')
{ ],
test: /\.tsx?$/, use: [
loader: 'awesome-typescript-loader', {
exclude: [ loader: 'awesome-typescript-loader?module=es6'
Path.resolve(__dirname, '../../node_modules/') },
]
},
] ]
}, },
plugins: [
new Webpack.DefinePlugin({ // static assets
'process.env': { { test: /\.html$/, use: 'html-loader' },
'NODE_ENV': JSON.stringify('production') { test: /\.png$/, use: 'url-loader?limit=10000' },
}, { test: /\.jpg$/, use: 'file-loader' },
'DEBUG': false, ],
'__DEVTOOLS__': false },
}), plugins: [
// Plugings for optimizing size and performance. new Webpack.DefinePlugin({
// Here you have all the available by now: 'process.env': {
// Webpack 1. https://github.com/webpack/webpack/blob/v1.13.3/lib/optimize 'NODE_ENV': JSON.stringify('production')
// Webpack 2. https://github.com/webpack/webpack/tree/master/lib/optimize },
new Webpack.optimize.UglifyJsPlugin({ 'DEBUG': false,
compress: { '__DEVTOOLS__': false
warnings: false, }),
screw_ie8: true, new Webpack.optimize.CommonsChunkPlugin({
conditionals: true, name: 'vendor',
unused: true, minChunks: Infinity,
comparisons: true, filename: 'vendor.js'
sequences: true, }),
dead_code: true, // Plugings for optimizing size and performance.
evaluate: true, // Here you have all the available by now:
if_return: true, // Webpack 1. https://github.com/webpack/webpack/blob/v1.13.3/lib/optimize
join_vars: true, // Webpack 2. https://github.com/webpack/webpack/tree/master/lib/optimize
drop_console: true, new Webpack.optimize.UglifyJsPlugin({
drop_debugger: true, compress: {
global_defs: { warnings: false,
__REACT_HOT_LOADER__: undefined // eslint-disable-line no-undefined screw_ie8: true,
} conditionals: true,
}, unused: true,
minimize: true, comparisons: true,
debug: false, sequences: true,
sourceMap: true, dead_code: true,
output: { evaluate: true,
comments: false if_return: true,
}, join_vars: true,
drop_console: true,
}), drop_debugger: true,
// Included by default in webpack 2 global_defs: {
// new webpack.optimize.OccurrenceOrderPlugin(), __REACT_HOT_LOADER__: undefined // eslint-disable-line no-undefined
new Webpack.optimize.AggressiveMergingPlugin() }
] },
minimize: true,
debug: false,
sourceMap: true,
output: {
comments: false
},
}),
// Included by default in webpack 2
// new webpack.optimize.OccurrenceOrderPlugin(),
new Webpack.optimize.AggressiveMergingPlugin()
]
}); });

1
package.json
View File

@ -45,6 +45,7 @@
"extract-text-webpack-plugin": "^3.0.2", "extract-text-webpack-plugin": "^3.0.2",
"file-loader": "^1.1.6", "file-loader": "^1.1.6",
"greenkeeper-postpublish": "^1.3.0", "greenkeeper-postpublish": "^1.3.0",
"html-loader": "^0.5.1",
"html-webpack-plugin": "^2.30.1", "html-webpack-plugin": "^2.30.1",
"image-webpack-loader": "^3.4.2", "image-webpack-loader": "^3.4.2",
"jest": "^21.2.1", "jest": "^21.2.1",

14
src/ts/@overflow/webapp/index.tsx
View File

@ -100,6 +100,16 @@ class WebAppApplication {
private renderApp(): void { private renderApp(): void {
WebAppApplication.isProduction ? this.renderProduction() : this.rederDevelopment(); WebAppApplication.isProduction ? this.renderProduction() : this.rederDevelopment();
// ReactDOM.render(
// <Provider store={this.store}>
// <ConnectedRouter history={this.history}>
// <WebApp/>
// </ConnectedRouter>
// </Provider>
// ,
// this.container,
// );
} }
private renderProduction(): void { private renderProduction(): void {
ReactDOM.render( ReactDOM.render(
@ -114,8 +124,8 @@ class WebAppApplication {
private rederDevelopment(): void { private rederDevelopment(): void {
if (module.hot) { if (module.hot) {
module.hot.accept('./pages/webapp', () => { module.hot.accept('./pages/webapp', async () => {
const NextApp = require('./pages/webapp').default; const NextApp = (await import('./pages/webapp')).default;
ReactDOM.render( ReactDOM.render(
<AppContainer> <AppContainer>
<Provider store={this.store}> <Provider store={this.store}>

2
src/ts/@overflow/webapp/pages/webapp.tsx
View File

@ -14,7 +14,7 @@ class WebApp extends React.Component<Props, State> {
public render(): JSX.Element { public render(): JSX.Element {
return ( return (
<b>Hello...</b> <b>Hello.</b>
); );
} }
} }