github/JavaScriptServices
1
1
Fork 0
mirror of https://github.com/aspnet/JavaScriptServices.git synced 2025-12-22 17:47:53 +00:00
Code Issues Packages Projects Releases Wiki Activity

Tweak ReactGrid's Webpack config in preparation for use of dev middleware

Browse Source
This commit is contained in:
SteveSandersonMS
2016-02-02 15:19:45 +00:00
parent 225dfdd168
commit 003918721d
7 changed files with 29 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
samples/react/ReactGrid/.babelrc Normal file
View File

@@ -0,0 +1,3 @@
{
presets: ["es2015", "react"]
}

4
samples/react/ReactGrid/.gitignore vendored
View File

@@ -1,6 +1,4 @@
/node_modules/
project.lock.json
/wwwroot/bundle.*
/wwwroot/*.svg
/wwwroot/*.css
/wwwroot/dist/
/Properties/launchSettings.json

16
samples/react/ReactGrid/ReactApp/components/CustomPager.jsx
View File

@@ -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 = <div className="btn btn-default"><Link className="previous" to={'/' + (this.props.currentPage)}><i className="glyphicon glyphicon-arrow-left"></i>{this.props.previousText}</Link></div>;
@@ -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" : "";

2
samples/react/ReactGrid/Views/Home/Index.cshtml
View File

@@ -1,5 +1,5 @@
<div id="react-app" asp-react-prerender-module="ReactApp/components/ReactApp.jsx"></div>
@section scripts {
<script src="/bundle.js"></script>
<script src="/dist/main.js"></script>
}

2
samples/react/ReactGrid/Views/Shared/_Layout.cshtml
View File

@@ -3,7 +3,7 @@
<head>
<meta charset="utf-8" />
<title>ReactExample</title>
<link rel="stylesheet" href="/main.css" />
<link rel="stylesheet" href="/dist/main.css" />
</head>
<body>
<div class="container">

2
samples/react/ReactGrid/package.json
View File

@@ -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",

19
samples/react/ReactGrid/webpack.config.js
View File

@@ -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')
]