From 003918721dd2adf39c1c353e7c80f7d90a9d1436 Mon Sep 17 00:00:00 2001 From: SteveSandersonMS Date: Tue, 2 Feb 2016 15:19:45 +0000 Subject: [PATCH] Tweak ReactGrid's Webpack config in preparation for use of dev middleware --- samples/react/ReactGrid/.babelrc | 3 +++ samples/react/ReactGrid/.gitignore | 4 +--- .../ReactApp/components/CustomPager.jsx | 16 ++++++++-------- .../react/ReactGrid/Views/Home/Index.cshtml | 2 +- .../ReactGrid/Views/Shared/_Layout.cshtml | 2 +- samples/react/ReactGrid/package.json | 2 +- samples/react/ReactGrid/webpack.config.js | 19 ++++++++++++++----- 7 files changed, 29 insertions(+), 19 deletions(-) create mode 100644 samples/react/ReactGrid/.babelrc diff --git a/samples/react/ReactGrid/.babelrc b/samples/react/ReactGrid/.babelrc new file mode 100644 index 0000000..15f26dd --- /dev/null +++ b/samples/react/ReactGrid/.babelrc @@ -0,0 +1,3 @@ +{ + presets: ["es2015", "react"] +} diff --git a/samples/react/ReactGrid/.gitignore b/samples/react/ReactGrid/.gitignore index ea034a8..22ae0ea 100644 --- a/samples/react/ReactGrid/.gitignore +++ b/samples/react/ReactGrid/.gitignore @@ -1,6 +1,4 @@ /node_modules/ project.lock.json -/wwwroot/bundle.* -/wwwroot/*.svg -/wwwroot/*.css +/wwwroot/dist/ /Properties/launchSettings.json diff --git a/samples/react/ReactGrid/ReactApp/components/CustomPager.jsx b/samples/react/ReactGrid/ReactApp/components/CustomPager.jsx index 44ce1b5..2bda259 100644 --- a/samples/react/ReactGrid/ReactApp/components/CustomPager.jsx +++ b/samples/react/ReactGrid/ReactApp/components/CustomPager.jsx @@ -1,4 +1,4 @@ -import React from 'react'; +import * as React from 'react'; import { Link } from 'react-router'; export class CustomPager extends React.Component { @@ -7,8 +7,8 @@ export class CustomPager extends React.Component { } render() { - var previous = ""; - var next = ""; + var previous = null; + var next = null; if(this.props.currentPage > 0){ previous =
{this.props.previousText}
; @@ -20,12 +20,12 @@ export class CustomPager extends React.Component { var options = []; - var startIndex = Math.max(this.props.currentPage - 5, 0); - var endIndex = Math.min(startIndex + 11, this.props.maxPage); + var startIndex = Math.max(this.props.currentPage - 5, 0); + var endIndex = Math.min(startIndex + 11, this.props.maxPage); - if (this.props.maxPage >= 11 && (endIndex - startIndex) <= 10) { - startIndex = endIndex - 11; - } + if (this.props.maxPage >= 11 && (endIndex - startIndex) <= 10) { + startIndex = endIndex - 11; + } for(var i = startIndex; i < endIndex ; i++){ var selected = this.props.currentPage == i ? "btn-default" : ""; diff --git a/samples/react/ReactGrid/Views/Home/Index.cshtml b/samples/react/ReactGrid/Views/Home/Index.cshtml index 25613eb..40b1291 100755 --- a/samples/react/ReactGrid/Views/Home/Index.cshtml +++ b/samples/react/ReactGrid/Views/Home/Index.cshtml @@ -1,5 +1,5 @@
@section scripts { - + } diff --git a/samples/react/ReactGrid/Views/Shared/_Layout.cshtml b/samples/react/ReactGrid/Views/Shared/_Layout.cshtml index a6fd7d5..0d504fc 100755 --- a/samples/react/ReactGrid/Views/Shared/_Layout.cshtml +++ b/samples/react/ReactGrid/Views/Shared/_Layout.cshtml @@ -3,7 +3,7 @@ ReactExample - +
diff --git a/samples/react/ReactGrid/package.json b/samples/react/ReactGrid/package.json index 0c90f38..5fc1c48 100644 --- a/samples/react/ReactGrid/package.json +++ b/samples/react/ReactGrid/package.json @@ -2,7 +2,7 @@ "name": "ReactExample", "version": "0.0.0", "dependencies": { - "babel-core": "^6.4.0", + "babel-core": "^6.4.5", "bootstrap": "^3.3.5", "formsy-react": "^0.17.0", "formsy-react-components": "^0.6.3", diff --git a/samples/react/ReactGrid/webpack.config.js b/samples/react/ReactGrid/webpack.config.js index b714399..b1151f1 100644 --- a/samples/react/ReactGrid/webpack.config.js +++ b/samples/react/ReactGrid/webpack.config.js @@ -1,18 +1,27 @@ +var path = require('path'); +var webpack = require('webpack'); var ExtractTextPlugin = require('extract-text-webpack-plugin'); module.exports = { - entry: './ReactApp/boot-client.jsx', - output: { - path: './wwwroot', - filename: 'bundle.js' + devtool: 'eval-source-map', + resolve: { + extensions: [ '', '.js', '.jsx' ] }, module: { loaders: [ - { test: /\.jsx?$/, loader: 'babel-loader', exclude: /node_modules/, query: { presets: ['es2015', 'react'] } }, + { test: /\.jsx?$/, loader: 'babel-loader', exclude: /node_modules/ }, { test: /\.css$/, loader: ExtractTextPlugin.extract('style-loader', 'css-loader') }, { test: /\.(png|woff|woff2|eot|ttf|svg)$/, loader: 'url-loader?limit=100000' } ] }, + entry: { + main: ['./ReactApp/boot-client.jsx'] + }, + output: { + path: path.join(__dirname, '/wwwroot/dist'), + filename: '[name].js', + publicPath: '/dist/' // Tells webpack-dev-middleware where to serve the dynamically compiled content from + }, plugins: [ new ExtractTextPlugin('main.css') ]