mirror of
https://github.com/wassname/react-webpack-template.git
synced 2026-06-28 02:30:46 +08:00
Compare commits
26 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| b3abd3159d | |||
| f56a70b13d | |||
| 1a12e83eb0 | |||
| d0720735be | |||
| 32fb22fbe6 | |||
| 9c921f608d | |||
| 834fe2569d | |||
| 9243cbfe57 | |||
| fcd1fe5ad1 | |||
| 27621bdd78 | |||
| d8d510a67d | |||
| 5ec8667f0f | |||
| fdf5601791 | |||
| 746e738443 | |||
| bed8436802 | |||
| cf5093cd39 | |||
| f4fcd9111e | |||
| 73fffaf9b9 | |||
| c6901b226a | |||
| 7742d6d89b | |||
| bcfc2f429f | |||
| 6d886d8bbc | |||
| b55b6f9216 | |||
| 3c46890e3f | |||
| c4e5b5448f | |||
| c4855a696b |
@@ -1,34 +1,79 @@
|
||||
# react-webpack-template - Changelog
|
||||
|
||||
## 1.3.1:
|
||||
|
||||
1. Removed karma-phantomjs-shim (with PhantomJS 2 there is no need for shims anymore)
|
||||
|
||||
## 1.3.0:
|
||||
|
||||
1. Updated phantomjs to 2.0
|
||||
|
||||
## 1.2.1:
|
||||
|
||||
1. Updated lodash to latest stable version
|
||||
2. Cleaned up formatting of unittests
|
||||
|
||||
## 1.2.0:
|
||||
|
||||
1. Updated core-js to new 2.0 stable
|
||||
2. Moved lodash and react-addons-testutils to devDependencies (provided by [harunhasdal](https://github.com/harunhasdal))
|
||||
3. Moved run component from ```src/components/run.js``` to ```src/index.js``` (provided by [stylesuxx](https://github.com/stylesuxx))
|
||||
|
||||
## 1.1.0:
|
||||
|
||||
1. Added support for easier webpack include management (can now be set via cfg/base.js, see README.md)
|
||||
|
||||
## 1.0.3:
|
||||
|
||||
1. Support for config independent settings in ```src/config/base.js``` (provided by [sthzg](https://github.com/sthzg))
|
||||
2. Fixed eslint loader path (provided by [HelloYie](https://github.com/HelloYie))
|
||||
3. Added support for babel-eslint (as suggested in https://github.com/newtriks/generator-react-webpack/issues/173)
|
||||
|
||||
## 1.0.2:
|
||||
|
||||
1. Added babel-eslint (as suggested in https://github.com/newtriks/generator-react-webpack/issues/173)
|
||||
|
||||
## 1.0.2:
|
||||
|
||||
1. Updated css-loader to current stable (0.23)
|
||||
2. Updated glob to new major (5.x to 6.x)
|
||||
|
||||
## 1.0.1:
|
||||
___Upgrades___:
|
||||
|
||||
1. Updated isparta-instrumenter-loader to new version 1.0
|
||||
|
||||
## 1.0.0:
|
||||
___Upgrades___:
|
||||
|
||||
1. Updated to babel core version (6.0.x)
|
||||
2. Replaced isparta-loader with the more current (and better maintained) isparta-instrumenter-loader.
|
||||
|
||||
## 0.3.2:
|
||||
___Features___:
|
||||
|
||||
1. Added support for bower components in webpack
|
||||
2. Added coverage reporting via karma-coverage
|
||||
|
||||
## 0.3.1:
|
||||
___Upgrades___:
|
||||
|
||||
1. Added bugfix for tests in watch mode (could be overridden by config)
|
||||
2. Added new badges to README
|
||||
3. Updated devDependencies to current ones
|
||||
|
||||
## 0.3.0:
|
||||
___Upgrades___:
|
||||
|
||||
1. Added webpacks define plugin for dist version
|
||||
2. Added new task ```test:watch``` to watch for changes
|
||||
|
||||
## 0.2.0:
|
||||
___Upgrades:___
|
||||
|
||||
1. Updated React from 0.13 to 0.14 (using ```^0.14```) as version string. This included minor code changes for components (now use the splitted "React"-Package) and the runner (Using React-DOM).
|
||||
2. Updated the shallow renderer for unit tests.
|
||||
|
||||
___Backwards incompatible changes:___
|
||||
|
||||
1. Default unit tests do not need to traverse down to `Component._store.props`, but directly to `Component.props`. Please keep this in mind when using properties in your tests.
|
||||
|
||||
@@ -25,6 +25,7 @@ Basically, it is currently only used as the base template of [generator-react-we
|
||||
|
||||
## Using it
|
||||
The template uses webpack as build tool to serve files and run tests. The following commands are available:
|
||||
|
||||
```bash
|
||||
# Start for development
|
||||
npm start # or
|
||||
@@ -53,6 +54,7 @@ npm run copy
|
||||
```
|
||||
|
||||
You can also use your globally installed version of webpack like this:
|
||||
|
||||
```bash
|
||||
# Build or run the dev version:
|
||||
webpack
|
||||
@@ -65,6 +67,18 @@ webpack-dev-server --env=dev
|
||||
webpack --env=dist
|
||||
webpack-dev-server --env=dist
|
||||
```
|
||||
|
||||
## Including third party modules (e.g. from npm)
|
||||
The default setting for the webpack configuration is to only include the ```src``` and ```test``` directories. If you want to add any modules from npm, you have to add them in ```cfg/base.js```. One example is:
|
||||
|
||||
```javascript
|
||||
// Somewhere on top of the file:
|
||||
let npmBase = path.join(__dirname, '../node_modules');
|
||||
let additionalPaths = [ path.join(npmBase, 'react-bootstrap') ];
|
||||
```
|
||||
|
||||
All entries added to the additionalPaths array will be appended to the include path for babel.
|
||||
|
||||
## A note on unit testing
|
||||
When running tests, coverage information (provided via Istanbul) will also be written into the ```coverage/``` directory. If you do not need this, just comment out or remove the section in ```karma.conf``` like this:
|
||||
|
||||
|
||||
+15
-6
@@ -1,10 +1,19 @@
|
||||
var path = require('path');
|
||||
'use strict';
|
||||
let path = require('path');
|
||||
|
||||
var port = 8000;
|
||||
var srcPath = path.join(__dirname, '/../src');
|
||||
var publicPath = '/assets/';
|
||||
let port = 8000;
|
||||
let srcPath = path.join(__dirname, '/../src');
|
||||
let publicPath = '/assets/';
|
||||
|
||||
// Additional npm or bower modules to include in builds
|
||||
// Add all foreign plugins you may need into this array
|
||||
// @example:
|
||||
// let npmBase = path.join(__dirname, '../node_modules');
|
||||
// let additionalPaths = [ path.join(npmBase, 'react-bootstrap') ];
|
||||
let additionalPaths = [];
|
||||
|
||||
module.exports = {
|
||||
additionalPaths: additionalPaths,
|
||||
port: port,
|
||||
debug: true,
|
||||
output: {
|
||||
@@ -35,14 +44,14 @@ module.exports = {
|
||||
preLoaders: [
|
||||
{
|
||||
test: /\.(js|jsx)$/,
|
||||
include: path.join(__dirname, 'src'),
|
||||
include: srcPath,
|
||||
loader: 'eslint-loader'
|
||||
}
|
||||
],
|
||||
loaders: [
|
||||
{
|
||||
test: /\.css$/,
|
||||
loader: 'style!css'
|
||||
loader: 'style-loader!css-loader'
|
||||
},
|
||||
{
|
||||
test: /\.sass/,
|
||||
|
||||
+13
-8
@@ -1,17 +1,19 @@
|
||||
var path = require('path');
|
||||
var webpack = require('webpack');
|
||||
var _ = require('lodash');
|
||||
'use strict';
|
||||
|
||||
var baseConfig = require('./base');
|
||||
let path = require('path');
|
||||
let webpack = require('webpack');
|
||||
let _ = require('lodash');
|
||||
|
||||
let baseConfig = require('./base');
|
||||
|
||||
// Add needed plugins here
|
||||
var BowerWebpackPlugin = require('bower-webpack-plugin');
|
||||
let BowerWebpackPlugin = require('bower-webpack-plugin');
|
||||
|
||||
var config = _.merge({
|
||||
let config = _.merge({
|
||||
entry: [
|
||||
'webpack-dev-server/client?http://127.0.0.1:8000',
|
||||
'webpack/hot/only-dev-server',
|
||||
'./src/components/run'
|
||||
'./src/index'
|
||||
],
|
||||
cache: true,
|
||||
devtool: 'eval',
|
||||
@@ -28,7 +30,10 @@ var config = _.merge({
|
||||
config.module.loaders.push({
|
||||
test: /\.(js|jsx)$/,
|
||||
loader: 'react-hot!babel-loader',
|
||||
include: path.join(__dirname, '/../src')
|
||||
include: [].concat(
|
||||
config.additionalPaths,
|
||||
[ path.join(__dirname, '/../src') ]
|
||||
)
|
||||
});
|
||||
|
||||
module.exports = config;
|
||||
|
||||
+13
-8
@@ -1,14 +1,16 @@
|
||||
var path = require('path');
|
||||
var webpack = require('webpack');
|
||||
var _ = require('lodash');
|
||||
'use strict';
|
||||
|
||||
var baseConfig = require('./base');
|
||||
let path = require('path');
|
||||
let webpack = require('webpack');
|
||||
let _ = require('lodash');
|
||||
|
||||
let baseConfig = require('./base');
|
||||
|
||||
// Add needed plugins here
|
||||
var BowerWebpackPlugin = require('bower-webpack-plugin');
|
||||
let BowerWebpackPlugin = require('bower-webpack-plugin');
|
||||
|
||||
var config = _.merge({
|
||||
entry: path.join(__dirname, '../src/components/run'),
|
||||
let config = _.merge({
|
||||
entry: path.join(__dirname, '../src/index'),
|
||||
cache: false,
|
||||
devtool: 'sourcemap',
|
||||
plugins: [
|
||||
@@ -29,7 +31,10 @@ var config = _.merge({
|
||||
config.module.loaders.push({
|
||||
test: /\.(js|jsx)$/,
|
||||
loader: 'babel',
|
||||
include: path.join(__dirname, '/../src')
|
||||
include: [].concat(
|
||||
config.additionalPaths,
|
||||
[ path.join(__dirname, '/../src') ]
|
||||
)
|
||||
});
|
||||
|
||||
module.exports = config;
|
||||
|
||||
+14
-7
@@ -1,8 +1,12 @@
|
||||
var path = require('path');
|
||||
var srcPath = path.join(__dirname, '/../src/');
|
||||
'use strict';
|
||||
|
||||
let path = require('path');
|
||||
let srcPath = path.join(__dirname, '/../src/');
|
||||
|
||||
let baseConfig = require('./base');
|
||||
|
||||
// Add needed plugins here
|
||||
var BowerWebpackPlugin = require('bower-webpack-plugin');
|
||||
let BowerWebpackPlugin = require('bower-webpack-plugin');
|
||||
|
||||
module.exports = {
|
||||
devtool: 'eval',
|
||||
@@ -24,10 +28,13 @@ module.exports = {
|
||||
{
|
||||
test: /\.(js|jsx)$/,
|
||||
loader: 'babel-loader',
|
||||
include: [
|
||||
path.join(__dirname, '/../src'),
|
||||
path.join(__dirname, '/../test')
|
||||
]
|
||||
include: [].concat(
|
||||
baseConfig.additionalPaths,
|
||||
[
|
||||
path.join(__dirname, '/../src'),
|
||||
path.join(__dirname, '/../test')
|
||||
]
|
||||
)
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
+1
-1
@@ -9,7 +9,7 @@ module.exports = function(config) {
|
||||
],
|
||||
port: 8080,
|
||||
captureTimeout: 60000,
|
||||
frameworks: [ 'phantomjs-shim', 'mocha', 'chai' ],
|
||||
frameworks: [ 'mocha', 'chai' ],
|
||||
client: {
|
||||
mocha: {}
|
||||
},
|
||||
|
||||
+9
-8
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "react-webpack-template",
|
||||
"version": "1.0.1",
|
||||
"version": "1.3.1",
|
||||
"description": "A base skeleton template for react and webpack without task runners",
|
||||
"main": "server.js",
|
||||
"scripts": {
|
||||
@@ -37,33 +37,35 @@
|
||||
"homepage": "https://github.com/weblogixx/react-webpack-template#readme",
|
||||
"devDependencies": {
|
||||
"babel-core": "^6.0.0",
|
||||
"babel-eslint": "^5.0.0-beta4",
|
||||
"babel-loader": "^6.0.0",
|
||||
"babel-preset-es2015": "^6.0.15",
|
||||
"babel-preset-react": "^6.0.15",
|
||||
"bower-webpack-plugin": "^0.1.9",
|
||||
"chai": "^3.2.0",
|
||||
"copyfiles": "^0.2.1",
|
||||
"css-loader": "^0.21.0",
|
||||
"css-loader": "^0.23.0",
|
||||
"eslint": "^1.2.1",
|
||||
"eslint-loader": "^1.0.0",
|
||||
"eslint-plugin-react": "^3.3.0",
|
||||
"file-loader": "^0.8.4",
|
||||
"glob": "^5.0.15",
|
||||
"glob": "^6.0.0",
|
||||
"isparta-instrumenter-loader": "^1.0.0",
|
||||
"karma": "^0.13.9",
|
||||
"karma-chai": "^0.1.0",
|
||||
"karma-coverage": "^0.5.3",
|
||||
"karma-mocha": "^0.2.0",
|
||||
"karma-mocha-reporter": "^1.1.1",
|
||||
"karma-phantomjs-launcher": "^0.2.1",
|
||||
"karma-phantomjs-shim": "^1.1.1",
|
||||
"karma-phantomjs-launcher": "^1.0.0",
|
||||
"karma-sourcemap-loader": "^0.3.5",
|
||||
"karma-webpack": "^1.7.0",
|
||||
"lodash": "^4.0.0",
|
||||
"minimist": "^1.2.0",
|
||||
"mocha": "^2.2.5",
|
||||
"null-loader": "^0.1.1",
|
||||
"open": "0.0.5",
|
||||
"phantomjs": "^1.9.18",
|
||||
"phantomjs-prebuilt": "^2.0.0",
|
||||
"react-addons-test-utils": "^0.14.0",
|
||||
"react-hot-loader": "^1.2.9",
|
||||
"rimraf": "^2.4.3",
|
||||
"style-loader": "^0.13.0",
|
||||
@@ -72,10 +74,9 @@
|
||||
"webpack-dev-server": "^1.12.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"lodash": "^3.10.1",
|
||||
"core-js": "^2.0.0",
|
||||
"normalize.css": "^3.0.3",
|
||||
"react": "^0.14.0",
|
||||
"react-addons-test-utils": "^0.14.0",
|
||||
"react-dom": "^0.14.0"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
/*eslint no-console:0 */
|
||||
require('core-js/fn/object/assign');
|
||||
var webpack = require('webpack');
|
||||
var WebpackDevServer = require('webpack-dev-server');
|
||||
var config = require('./webpack.config');
|
||||
|
||||
@@ -0,0 +1,6 @@
|
||||
'use strict';
|
||||
|
||||
|
||||
// Settings configured here will be merged into the final config object.
|
||||
export default {
|
||||
}
|
||||
+5
-2
@@ -1,7 +1,10 @@
|
||||
'use strict';
|
||||
|
||||
const config = {
|
||||
import baseConfig from './base';
|
||||
|
||||
|
||||
let config = {
|
||||
appEnv: 'dev' // feel free to remove the appEnv property here
|
||||
};
|
||||
|
||||
export default config;
|
||||
export default Object.freeze(Object.assign({}, baseConfig, config));
|
||||
|
||||
+6
-2
@@ -1,7 +1,11 @@
|
||||
'use strict';
|
||||
|
||||
const config = {
|
||||
import baseConfig from './base';
|
||||
|
||||
|
||||
let config = {
|
||||
appEnv: 'dist' // feel free to remove the appEnv property here
|
||||
};
|
||||
|
||||
export default config;
|
||||
export default Object.freeze(Object.assign({}, baseConfig, config));
|
||||
|
||||
|
||||
+6
-2
@@ -1,7 +1,11 @@
|
||||
'use strict';
|
||||
|
||||
const config = {
|
||||
import baseConfig from './base';
|
||||
|
||||
|
||||
let config = {
|
||||
appEnv: 'test' // don't remove the appEnv property here
|
||||
};
|
||||
|
||||
export default config;
|
||||
export default Object.freeze(Object.assign(baseConfig, config));
|
||||
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
import 'core-js/fn/object/assign';
|
||||
import React from 'react';
|
||||
import ReactDOM from 'react-dom';
|
||||
import App from './Main';
|
||||
import App from './components/Main';
|
||||
|
||||
// Render the main component into the dom
|
||||
ReactDOM.render(<App />, document.getElementById('app'));
|
||||
@@ -11,13 +11,13 @@ import createComponent from 'helpers/shallowRenderHelper';
|
||||
import Main from 'components/Main';
|
||||
|
||||
describe('MainComponent', () => {
|
||||
let MainComponent;
|
||||
let MainComponent;
|
||||
|
||||
beforeEach(() => {
|
||||
MainComponent = createComponent(Main);
|
||||
});
|
||||
beforeEach(() => {
|
||||
MainComponent = createComponent(Main);
|
||||
});
|
||||
|
||||
it('should have its component name as default className', () => {
|
||||
expect(MainComponent.props.className).to.equal('index');
|
||||
});
|
||||
it('should have its component name as default className', () => {
|
||||
expect(MainComponent.props.className).to.equal('index');
|
||||
});
|
||||
});
|
||||
|
||||
@@ -1,5 +1,7 @@
|
||||
'use strict';
|
||||
|
||||
require('core-js/fn/object/assign');
|
||||
|
||||
// Add support for all files in the test directory
|
||||
const testsContext = require.context('.', true, /(Test\.js$)|(Helper\.js$)/);
|
||||
testsContext.keys().forEach(testsContext);
|
||||
|
||||
Reference in New Issue
Block a user