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

Updated ReactReduxSpa template to match current patterns

Browse Source
This commit is contained in:
SteveSandersonMS
2016-09-28 17:43:22 +01:00
parent a9ce762827
commit 0a961a7bd0
12 changed files with 95 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
templates/ReactReduxSpa/ClientApp/dist/_placeholder.txt vendored Normal file
View File

@@ -0,0 +1,9 @@
------------------------------------------------------------------
Don't delete this file. Do include it in your source control repo.
------------------------------------------------------------------
This file exists as a workaround for https://github.com/dotnet/cli/issues/1396
('dotnet publish' does not publish any directories that didn't exist or were
empty before the publish script started).
Hopefully, this can be removed after the move to the new MSBuild.

6
templates/ReactReduxSpa/ClientApp/routes.tsx
View File

@@ -12,3 +12,9 @@ export default <Route component={ Layout }>
<Route path='(:startDateIndex)' /> { /* Optional route segment that does not affect NavMenu highlighting */ }
</Route>
</Route>;
// Allow Hot Module Reloading
declare var module: any;
if (module.hot) {
module.hot.accept();
}

2
templates/ReactReduxSpa/ClientApp/store/Counter.ts
View File

@@ -33,7 +33,7 @@ export const reducer: Reducer<CounterState> = (state, action) => {
if (isActionType(action, IncrementCount)) {
return { count: state.count + 1 };
}
// For unrecognized actions (or in cases where actions have no effect), must return the existing state
// (or default initial state if none was supplied)
return state || { count: 0 };

5
templates/ReactReduxSpa/Views/Home/Index.cshtml
View File

@@ -2,9 +2,8 @@
ViewData["Title"] = "Home Page";
}
<div id="react-app" asp-prerender-module="ClientApp/boot-server"
asp-prerender-webpack-config="webpack.config.js">Loading...</div>
<div id="react-app" asp-prerender-module="ClientApp/dist/main-server">Loading...</div>
@section scripts {
<script src="~/dist/main.js" asp-append-version="true"></script>
<script src="~/dist/main-client.js" asp-append-version="true"></script>
}

6
templates/ReactReduxSpa/package.json
View File

@@ -12,7 +12,6 @@
"bootstrap": "^3.3.6",
"css-loader": "^0.23.1",
"domain-task": "^2.0.0",
"extendify": "^1.0.0",
"extract-text-webpack-plugin": "^1.0.1",
"file-loader": "^0.8.5",
"jquery": "^2.2.1",
@@ -28,8 +27,9 @@
"ts-loader": "^0.8.1",
"typescript": "^1.8.2",
"url-loader": "^0.5.7",
"webpack-externals-plugin": "^1.0.0",
"webpack": "^1.12.14",
"webpack-hot-middleware": "^2.10.0"
"webpack-externals-plugin": "^1.0.0",
"webpack-hot-middleware": "^2.10.0",
"webpack-merge": "^0.14.1"
}
}

11
templates/ReactReduxSpa/project.json
View File

@@ -51,16 +51,11 @@
"publishOptions": {
"include": [
".babelrc",
"appsettings.json",
"ClientApp",
"ClientApp/dist",
"node_modules",
"typings",
"Views",
"tsconfig.json",
"tsd.json",
"web.config",
"webpack.*.js",
"wwwroot"
]
},
@@ -68,8 +63,8 @@
"scripts": {
"prepublish": [
"npm install",
"node node_modules/webpack/bin/webpack.js --config webpack.config.vendor.js",
"node node_modules/webpack/bin/webpack.js"
"node node_modules/webpack/bin/webpack.js --config webpack.config.vendor.js --env.prod",
"node node_modules/webpack/bin/webpack.js --env.prod"
],
"postpublish": [ "dotnet publish-iis --publish-folder %publish:OutputPath% --framework %publish:FullTargetFramework%" ]
},

8
templates/ReactReduxSpa/template_gitignore
View File

@@ -28,7 +28,13 @@ Obj/
# Visual Studio 2015 cache/options directory
.vs/
/wwwroot/dist/
/wwwroot/dist/**
/ClientApp/dist/**
# Workaround for https://github.com/aspnet/JavaScriptServices/issues/235
!/wwwroot/dist/_placeholder.txt
!/ClientApp/dist/_placeholder.txt
# MSTest test Results
[Tt]est[Rr]esult*/

3
templates/ReactReduxSpa/webpack.config.dev.js
View File

@@ -1,3 +0,0 @@
module.exports = {
devtool: 'inline-source-map'
};

68
templates/ReactReduxSpa/webpack.config.js
View File

@@ -1,36 +1,60 @@
var isDevBuild = process.argv.indexOf('--env.prod') < 0;
var path = require('path');
var webpack = require('webpack');
var ExtractTextPlugin = require('extract-text-webpack-plugin');
var merge = require('extendify')({ isDeep: true, arrays: 'concat' });
var devConfig = require('./webpack.config.dev');
var prodConfig = require('./webpack.config.prod');
var isDevelopment = process.env.ASPNETCORE_ENVIRONMENT === 'Development';
var extractCSS = new ExtractTextPlugin('site.css');
var nodeExternals = require('webpack-node-externals');
var merge = require('webpack-merge');
var allFilenamesExceptJavaScript = /\.(?!js(\?|$))([^.]+(\?|$))/;
module.exports = merge({
resolve: {
extensions: [ '', '.js', '.jsx', '.ts', '.tsx' ]
// Configuration in common to both client-side and server-side bundles
var sharedConfig = () => ({
resolve: { extensions: [ '', '.js', '.jsx', '.ts', '.tsx' ] },
output: {
filename: '[name].js',
publicPath: '/dist/' // Webpack dev middleware, if enabled, handles requests for this URL prefix
},
module: {
loaders: [
{ test: /\.ts(x?)$/, include: /ClientApp/, loader: 'babel-loader' },
{ test: /\.ts(x?)$/, include: /ClientApp/, loader: 'ts-loader?silent=true' },
{ test: /\.css/, loader: extractCSS.extract(['css']) }
{ test: /\.tsx?$/, include: /ClientApp/, loader: 'babel-loader' },
{ test: /\.tsx?$/, include: /ClientApp/, loader: 'ts', query: { silent: true } }
]
}
});
// Configuration for client-side bundle suitable for running in browsers
var clientBundleConfig = merge(sharedConfig(), {
entry: { 'main-client': './ClientApp/boot-client.tsx' },
module: {
loaders: [
{ test: /\.css$/, loader: ExtractTextPlugin.extract(['css']) },
{ test: /\.(png|jpg|jpeg|gif|svg)$/, loader: 'url', query: { limit: 25000 } }
]
},
entry: {
main: ['./ClientApp/boot-client.tsx'],
},
output: {
path: path.join(__dirname, 'wwwroot', 'dist'),
filename: '[name].js',
publicPath: '/dist/'
},
output: { path: path.join(__dirname, './wwwroot/dist') },
devtool: isDevBuild ? 'inline-source-map' : null,
plugins: [
extractCSS,
new ExtractTextPlugin('site.css'),
new webpack.DllReferencePlugin({
context: __dirname,
manifest: require('./wwwroot/dist/vendor-manifest.json')
})
]
}, isDevelopment ? devConfig : prodConfig);
].concat(isDevBuild ? [] : [
// Plugins that apply in production builds only
new webpack.optimize.OccurenceOrderPlugin(),
new webpack.optimize.UglifyJsPlugin({ compress: { warnings: false } })
])
});
// Configuration for server-side (prerendering) bundle suitable for running in Node
var serverBundleConfig = merge(sharedConfig(), {
entry: { 'main-server': './ClientApp/boot-server.tsx' },
output: {
libraryTarget: 'commonjs',
path: path.join(__dirname, './ClientApp/dist')
},
target: 'node',
devtool: 'inline-source-map',
externals: [nodeExternals({ whitelist: [allFilenamesExceptJavaScript] })] // Don't bundle .js files from node_modules
});
module.exports = [clientBundleConfig, serverBundleConfig];

9
templates/ReactReduxSpa/webpack.config.prod.js
View File

@@ -1,9 +0,0 @@
var webpack = require('webpack');
module.exports = {
plugins: [
new webpack.optimize.OccurenceOrderPlugin(),
new webpack.optimize.UglifyJsPlugin({ compress: { warnings: false } }),
new webpack.DefinePlugin({ 'process.env.NODE_ENV': '"production"' })
]
};

16
templates/ReactReduxSpa/webpack.config.vendor.js
View File

@@ -1,8 +1,8 @@
var isDevBuild = process.argv.indexOf('--env.prod') < 0;
var path = require('path');
var webpack = require('webpack');
var ExtractTextPlugin = require('extract-text-webpack-plugin');
var extractCSS = new ExtractTextPlugin('vendor.css');
var isDevelopment = process.env.ASPNETCORE_ENVIRONMENT === 'Development';
module.exports = {
resolve: {
@@ -10,12 +10,12 @@ module.exports = {
},
module: {
loaders: [
{ test: /\.(png|woff|woff2|eot|ttf|svg)$/, loader: 'url-loader?limit=100000' },
{ test: /\.css/, loader: extractCSS.extract(['css']) }
{ test: /\.(png|woff|woff2|eot|ttf|svg)(\?|$)/, loader: 'url-loader?limit=100000' },
{ test: /\.css(\?|$)/, loader: extractCSS.extract(['css']) }
]
},
entry: {
vendor: ['bootstrap', 'bootstrap/dist/css/bootstrap.css', 'react', 'react-dom', 'react-router', 'style-loader', 'jquery'],
vendor: ['bootstrap', 'bootstrap/dist/css/bootstrap.css', 'domain-task', 'react', 'react-dom', 'react-router', 'redux', 'redux-thunk', 'react-router-redux', 'redux-typed', 'style-loader', 'jquery'],
},
output: {
path: path.join(__dirname, 'wwwroot', 'dist'),
@@ -29,9 +29,11 @@ module.exports = {
new webpack.DllPlugin({
path: path.join(__dirname, 'wwwroot', 'dist', '[name]-manifest.json'),
name: '[name]_[hash]'
}),
new webpack.DefinePlugin({
'process.env.NODE_ENV': isDevBuild ? '"development"' : '"production"'
})
].concat(isDevelopment ? [] : [
new webpack.optimize.UglifyJsPlugin({ compress: { warnings: false } }),
new webpack.DefinePlugin({ 'process.env.NODE_ENV': '"production"' })
].concat(isDevBuild ? [] : [
new webpack.optimize.UglifyJsPlugin({ compress: { warnings: false } })
])
};

9
templates/ReactReduxSpa/wwwroot/dist/_placeholder.txt vendored Normal file
View File

@@ -0,0 +1,9 @@
------------------------------------------------------------------
Don't delete this file. Do include it in your source control repo.
------------------------------------------------------------------
This file exists as a workaround for https://github.com/dotnet/cli/issues/1396
('dotnet publish' does not publish any directories that didn't exist or were
empty before the publish script started).
Hopefully, this can be removed after the move to the new MSBuild.