mirror of
https://github.com/wassname/react-webpack-template.git
synced 2026-06-28 02:46:48 +08:00
Compare commits
59 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| da0e6a06e8 | |||
| c0e5461e03 | |||
| 45b31f0227 | |||
| ce025c4116 | |||
| f93fa39ebb | |||
| 27fa8153f8 | |||
| a75c391626 | |||
| 8faa282e31 | |||
| 19f9ea6fbb | |||
| e89ec8315a | |||
| 90e9e12fc6 | |||
| 21db896237 | |||
| 2c0b7cfda9 | |||
| 798e28c227 | |||
| d75c3b436b | |||
| de2e4bb5eb | |||
| eceb3c6a28 | |||
| 9da1b7caeb | |||
| e1597a4807 | |||
| 9b062b4d87 | |||
| 0f019fe2c7 | |||
| f556d20d57 | |||
| b0014e00e0 | |||
| 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 | |||
| fb1f271f6b | |||
| 5d512c5bf5 | |||
| 9ecfa9ef90 | |||
| 614fcfc54e | |||
| bbd0f7666e | |||
| 33150f0cf6 | |||
| 831fb6f8b9 | |||
| 2538e2c405 | |||
| 4cd213706e | |||
| b3f99eb73e |
@@ -1,16 +1,21 @@
|
|||||||
{
|
{
|
||||||
|
"parser": "babel-eslint",
|
||||||
"plugins": [
|
"plugins": [
|
||||||
"react"
|
"react"
|
||||||
],
|
],
|
||||||
"ecmaFeatures": {
|
"parserOptions": {
|
||||||
"jsx": true,
|
"ecmaVersion": 6,
|
||||||
"modules": true
|
"sourceType": "module",
|
||||||
|
"ecmaFeatures": {
|
||||||
|
"jsx": true
|
||||||
|
}
|
||||||
},
|
},
|
||||||
"env": {
|
"env": {
|
||||||
"browser": true,
|
"browser": true,
|
||||||
"amd": true,
|
"amd": true,
|
||||||
"es6": true,
|
"es6": true,
|
||||||
"node": true
|
"node": true,
|
||||||
|
"mocha": true
|
||||||
},
|
},
|
||||||
"rules": {
|
"rules": {
|
||||||
"comma-dangle": 1,
|
"comma-dangle": 1,
|
||||||
@@ -24,6 +29,7 @@
|
|||||||
"no-trailing-spaces": [1, { "skipBlankLines": true }],
|
"no-trailing-spaces": [1, { "skipBlankLines": true }],
|
||||||
"no-unreachable": 1,
|
"no-unreachable": 1,
|
||||||
"no-alert": 0,
|
"no-alert": 0,
|
||||||
"react/jsx-uses-react": 1
|
"react/jsx-uses-react": 1,
|
||||||
|
"react/jsx-uses-vars": 1
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,20 +1,105 @@
|
|||||||
# react-webpack-template - Changelog
|
# react-webpack-template - Changelog
|
||||||
|
|
||||||
|
## 1.5.3:
|
||||||
|
|
||||||
|
1. Asset paths are now relative (makes it easier to use bundles in subdirectories)
|
||||||
|
2. Removed loading problems for webpack configurations overriding (see https://github.com/newtriks/generator-react-webpack/issues/194)
|
||||||
|
3. Added missing loader configuration for movies and svg file types
|
||||||
|
|
||||||
|
## 1.5.2:
|
||||||
|
|
||||||
|
1. Updated dependencies to latests (babel-eslint, eslint, karma-mocha-reporter, normalize.css)
|
||||||
|
|
||||||
|
## 1.5.1:
|
||||||
|
|
||||||
|
1. Emergency fix for correct eslint version (2.3 is currently buggy). Fixes https://github.com/newtriks/generator-react-webpack/issues/196
|
||||||
|
2. Added mocha to eslint global config as requested in https://github.com/newtriks/generator-react-webpack/issues/195
|
||||||
|
|
||||||
|
## 1.5.0:
|
||||||
|
|
||||||
|
1. Added babel polyfill to tests per default (provided by [Igonato](https://github.com/Igonato))
|
||||||
|
2. Updated eslint to version 2.0
|
||||||
|
3. Updated glob package to version 7.0
|
||||||
|
|
||||||
|
## 1.4.0:
|
||||||
|
|
||||||
|
1. Refactored webpack config to use Object.assign instead of lodash
|
||||||
|
2. Added dynamic port for webpack dev server (provided by [kashiif](https://github.com/kashiif))
|
||||||
|
|
||||||
|
## 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:
|
## 0.3.1:
|
||||||
___Upgrades___:
|
___Upgrades___:
|
||||||
|
|
||||||
1. Added bugfix for tests in watch mode (could be overridden by config)
|
1. Added bugfix for tests in watch mode (could be overridden by config)
|
||||||
2. Added new badges to README
|
2. Added new badges to README
|
||||||
3. Updated devDependencies to current ones
|
3. Updated devDependencies to current ones
|
||||||
|
|
||||||
## 0.3.0:
|
## 0.3.0:
|
||||||
___Upgrades___:
|
___Upgrades___:
|
||||||
|
|
||||||
1. Added webpacks define plugin for dist version
|
1. Added webpacks define plugin for dist version
|
||||||
2. Added new task ```test:watch``` to watch for changes
|
2. Added new task ```test:watch``` to watch for changes
|
||||||
|
|
||||||
## 0.2.0:
|
## 0.2.0:
|
||||||
___Upgrades:___
|
___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).
|
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.
|
2. Updated the shallow renderer for unit tests.
|
||||||
|
|
||||||
___Backwards incompatible changes:___
|
___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.
|
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.
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
The MIT License (MIT)
|
The MIT License (MIT)
|
||||||
|
|
||||||
Copyright (c) 2015 Chris
|
Copyright (c) 2015 Christian Schilling <cs@weblogixx.de>
|
||||||
|
|
||||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||||
of this software and associated documentation files (the "Software"), to deal
|
of this software and associated documentation files (the "Software"), to deal
|
||||||
@@ -19,4 +19,3 @@ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|||||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||||
SOFTWARE.
|
SOFTWARE.
|
||||||
|
|
||||||
|
|||||||
@@ -9,15 +9,12 @@ The following features are currently included:
|
|||||||
|
|
||||||
- [x] Webpack and Webpack-Dev-Server, including hot-loader
|
- [x] Webpack and Webpack-Dev-Server, including hot-loader
|
||||||
- [x] Babel and JSX
|
- [x] Babel and JSX
|
||||||
- [x] Mocha Unit tests (*optional*)
|
- [x] Mocha Unit tests
|
||||||
- [x] esLint Support
|
- [x] esLint Support
|
||||||
- [x] No dependency on grunt, gulp or the next hot taskrunner!
|
- [x] No dependency on grunt, gulp or the next hot taskrunner!
|
||||||
- [x] Support for environment-specific configuration files
|
- [x] Support for environment-specific configuration files
|
||||||
- [x] Support for code coverage via [isparta-loader](https://github.com/deepsweet/isparta-loader)
|
- [x] Support for code coverage via [isparta-loader](https://github.com/deepsweet/isparta-loader)
|
||||||
|
|
||||||
## Todo
|
|
||||||
- [ ] Better performance for webpack builds
|
|
||||||
|
|
||||||
## What is it for?
|
## What is it for?
|
||||||
This template can be used directly for the creation of new projects. When using it like this, make sure to ___not___ install it via npm but download it directly. The template is (nearly) useless for itself when downloaded via npm!
|
This template can be used directly for the creation of new projects. When using it like this, make sure to ___not___ install it via npm but download it directly. The template is (nearly) useless for itself when downloaded via npm!
|
||||||
|
|
||||||
@@ -25,6 +22,7 @@ Basically, it is currently only used as the base template of [generator-react-we
|
|||||||
|
|
||||||
## Using it
|
## Using it
|
||||||
The template uses webpack as build tool to serve files and run tests. The following commands are available:
|
The template uses webpack as build tool to serve files and run tests. The following commands are available:
|
||||||
|
|
||||||
```bash
|
```bash
|
||||||
# Start for development
|
# Start for development
|
||||||
npm start # or
|
npm start # or
|
||||||
@@ -53,6 +51,7 @@ npm run copy
|
|||||||
```
|
```
|
||||||
|
|
||||||
You can also use your globally installed version of webpack like this:
|
You can also use your globally installed version of webpack like this:
|
||||||
|
|
||||||
```bash
|
```bash
|
||||||
# Build or run the dev version:
|
# Build or run the dev version:
|
||||||
webpack
|
webpack
|
||||||
@@ -65,6 +64,18 @@ webpack-dev-server --env=dev
|
|||||||
webpack --env=dist
|
webpack --env=dist
|
||||||
webpack-dev-server --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
|
## 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:
|
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:
|
||||||
|
|
||||||
@@ -97,3 +108,5 @@ react-webpack-template is available under MIT-License and can therefore be used
|
|||||||
- Christian Schilling (cs@weblogixx.de)
|
- Christian Schilling (cs@weblogixx.de)
|
||||||
- Martin Jul (martin@mjul.com)
|
- Martin Jul (martin@mjul.com)
|
||||||
- Stephan Herzog (sthzgvie@gmail.com)
|
- Stephan Herzog (sthzgvie@gmail.com)
|
||||||
|
- Kashif Iqbal Khan
|
||||||
|
- Ignat Shining (mail@igonato.com)
|
||||||
|
|||||||
+22
-49
@@ -1,69 +1,42 @@
|
|||||||
var path = require('path');
|
'use strict';
|
||||||
|
let path = require('path');
|
||||||
|
let defaultSettings = require('./defaults');
|
||||||
|
|
||||||
var port = 8000;
|
// Additional npm or bower modules to include in builds
|
||||||
var srcPath = path.join(__dirname, '/../src');
|
// Add all foreign plugins you may need into this array
|
||||||
var publicPath = '/assets/';
|
// @example:
|
||||||
|
// let npmBase = path.join(__dirname, '../node_modules');
|
||||||
|
// let additionalPaths = [ path.join(npmBase, 'react-bootstrap') ];
|
||||||
|
let additionalPaths = [];
|
||||||
|
|
||||||
module.exports = {
|
module.exports = {
|
||||||
port: port,
|
additionalPaths: additionalPaths,
|
||||||
|
port: defaultSettings.port,
|
||||||
debug: true,
|
debug: true,
|
||||||
|
devtool: 'eval',
|
||||||
output: {
|
output: {
|
||||||
path: path.join(__dirname, '/../dist/assets'),
|
path: path.join(__dirname, '/../dist/assets'),
|
||||||
filename: 'app.js',
|
filename: 'app.js',
|
||||||
publicPath: publicPath
|
publicPath: `.${defaultSettings.publicPath}`
|
||||||
},
|
},
|
||||||
devServer: {
|
devServer: {
|
||||||
contentBase: './src/',
|
contentBase: './src/',
|
||||||
historyApiFallback: true,
|
historyApiFallback: true,
|
||||||
hot: true,
|
hot: true,
|
||||||
port: port,
|
port: defaultSettings.port,
|
||||||
publicPath: publicPath,
|
publicPath: defaultSettings.publicPath,
|
||||||
noInfo: false
|
noInfo: false
|
||||||
},
|
},
|
||||||
resolve: {
|
resolve: {
|
||||||
extensions: ['', '.js', '.jsx'],
|
extensions: ['', '.js', '.jsx'],
|
||||||
alias: {
|
alias: {
|
||||||
actions: srcPath + '/actions/',
|
actions: `${defaultSettings.srcPath}/actions/`,
|
||||||
components: srcPath + '/components/',
|
components: `${defaultSettings.srcPath}/components/`,
|
||||||
sources: srcPath + '/sources/',
|
sources: `${defaultSettings.srcPath}/sources/`,
|
||||||
stores: srcPath + '/stores/',
|
stores: `${defaultSettings.srcPath}/stores/`,
|
||||||
styles: srcPath + '/styles/',
|
styles: `${defaultSettings.srcPath}/styles/`,
|
||||||
config: srcPath + '/config/' + process.env.REACT_WEBPACK_ENV
|
config: `${defaultSettings.srcPath}/config/` + process.env.REACT_WEBPACK_ENV
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
module: {
|
module: {}
|
||||||
preLoaders: [
|
|
||||||
{
|
|
||||||
test: /\.(js|jsx)$/,
|
|
||||||
include: path.join(__dirname, 'src'),
|
|
||||||
loader: 'eslint-loader'
|
|
||||||
}
|
|
||||||
],
|
|
||||||
loaders: [
|
|
||||||
{
|
|
||||||
test: /\.css$/,
|
|
||||||
loader: 'style!css'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
test: /\.sass/,
|
|
||||||
loader: 'style-loader!css-loader!sass-loader?outputStyle=expanded&indentedSyntax'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
test: /\.scss/,
|
|
||||||
loader: 'style-loader!css-loader!sass-loader?outputStyle=expanded'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
test: /\.less/,
|
|
||||||
loader: 'style-loader!css-loader!less-loader'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
test: /\.styl/,
|
|
||||||
loader: 'style-loader!css-loader!stylus-loader'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
test: /\.(png|jpg|gif|woff|woff2)$/,
|
|
||||||
loader: 'url-loader?limit=8192'
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -0,0 +1,64 @@
|
|||||||
|
/**
|
||||||
|
* Function that returns default values.
|
||||||
|
* Used because Object.assign does a shallow instead of a deep copy.
|
||||||
|
* Using [].push will add to the base array, so a require will alter
|
||||||
|
* the base array output.
|
||||||
|
*/
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
const path = require('path');
|
||||||
|
const srcPath = path.join(__dirname, '/../src');
|
||||||
|
const dfltPort = 8000;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Get the default modules object for webpack
|
||||||
|
* @return {Object}
|
||||||
|
*/
|
||||||
|
function getDefaultModules() {
|
||||||
|
return {
|
||||||
|
preLoaders: [
|
||||||
|
{
|
||||||
|
test: /\.(js|jsx)$/,
|
||||||
|
include: srcPath,
|
||||||
|
loader: 'eslint-loader'
|
||||||
|
}
|
||||||
|
],
|
||||||
|
loaders: [
|
||||||
|
{
|
||||||
|
test: /\.css$/,
|
||||||
|
loader: 'style-loader!css-loader'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
test: /\.sass/,
|
||||||
|
loader: 'style-loader!css-loader!sass-loader?outputStyle=expanded&indentedSyntax'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
test: /\.scss/,
|
||||||
|
loader: 'style-loader!css-loader!sass-loader?outputStyle=expanded'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
test: /\.less/,
|
||||||
|
loader: 'style-loader!css-loader!less-loader'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
test: /\.styl/,
|
||||||
|
loader: 'style-loader!css-loader!stylus-loader'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
test: /\.(png|jpg|gif|woff|woff2)$/,
|
||||||
|
loader: 'url-loader?limit=8192'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
test: /\.(mp4|ogg|svg)$/,
|
||||||
|
loader: 'file-loader'
|
||||||
|
}
|
||||||
|
]
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
module.exports = {
|
||||||
|
srcPath: srcPath,
|
||||||
|
publicPath: '/assets/',
|
||||||
|
port: dfltPort,
|
||||||
|
getDefaultModules: getDefaultModules
|
||||||
|
};
|
||||||
+18
-13
@@ -1,34 +1,39 @@
|
|||||||
var path = require('path');
|
'use strict';
|
||||||
var webpack = require('webpack');
|
|
||||||
var _ = require('lodash');
|
|
||||||
|
|
||||||
var baseConfig = require('./base');
|
let path = require('path');
|
||||||
|
let webpack = require('webpack');
|
||||||
|
let baseConfig = require('./base');
|
||||||
|
let defaultSettings = require('./defaults');
|
||||||
|
|
||||||
// Add needed plugins here
|
// Add needed plugins here
|
||||||
var BowerWebpackPlugin = require('bower-webpack-plugin');
|
let BowerWebpackPlugin = require('bower-webpack-plugin');
|
||||||
|
|
||||||
var config = _.merge({
|
let config = Object.assign({}, baseConfig, {
|
||||||
entry: [
|
entry: [
|
||||||
'webpack-dev-server/client?http://127.0.0.1:8000',
|
'webpack-dev-server/client?http://127.0.0.1:' + defaultSettings.port,
|
||||||
'webpack/hot/only-dev-server',
|
'webpack/hot/only-dev-server',
|
||||||
'./src/components/run'
|
'./src/index'
|
||||||
],
|
],
|
||||||
cache: true,
|
cache: true,
|
||||||
devtool: 'eval',
|
devtool: 'eval-source-map',
|
||||||
plugins: [
|
plugins: [
|
||||||
new webpack.HotModuleReplacementPlugin(),
|
new webpack.HotModuleReplacementPlugin(),
|
||||||
new webpack.NoErrorsPlugin(),
|
new webpack.NoErrorsPlugin(),
|
||||||
new BowerWebpackPlugin({
|
new BowerWebpackPlugin({
|
||||||
searchResolveModulesDirectories: false
|
searchResolveModulesDirectories: false
|
||||||
})
|
})
|
||||||
]
|
],
|
||||||
}, baseConfig);
|
module: defaultSettings.getDefaultModules()
|
||||||
|
});
|
||||||
|
|
||||||
// Add needed loaders
|
// Add needed loaders to the defaults here
|
||||||
config.module.loaders.push({
|
config.module.loaders.push({
|
||||||
test: /\.(js|jsx)$/,
|
test: /\.(js|jsx)$/,
|
||||||
loader: 'react-hot!babel-loader',
|
loader: 'react-hot!babel-loader',
|
||||||
include: path.join(__dirname, '/../src')
|
include: [].concat(
|
||||||
|
config.additionalPaths,
|
||||||
|
[ path.join(__dirname, '/../src') ]
|
||||||
|
)
|
||||||
});
|
});
|
||||||
|
|
||||||
module.exports = config;
|
module.exports = config;
|
||||||
|
|||||||
+17
-10
@@ -1,14 +1,16 @@
|
|||||||
var path = require('path');
|
'use strict';
|
||||||
var webpack = require('webpack');
|
|
||||||
var _ = require('lodash');
|
|
||||||
|
|
||||||
var baseConfig = require('./base');
|
let path = require('path');
|
||||||
|
let webpack = require('webpack');
|
||||||
|
|
||||||
|
let baseConfig = require('./base');
|
||||||
|
let defaultSettings = require('./defaults');
|
||||||
|
|
||||||
// Add needed plugins here
|
// Add needed plugins here
|
||||||
var BowerWebpackPlugin = require('bower-webpack-plugin');
|
let BowerWebpackPlugin = require('bower-webpack-plugin');
|
||||||
|
|
||||||
var config = _.merge({
|
let config = Object.assign({}, baseConfig, {
|
||||||
entry: path.join(__dirname, '../src/components/run'),
|
entry: path.join(__dirname, '../src/index'),
|
||||||
cache: false,
|
cache: false,
|
||||||
devtool: 'sourcemap',
|
devtool: 'sourcemap',
|
||||||
plugins: [
|
plugins: [
|
||||||
@@ -23,13 +25,18 @@ var config = _.merge({
|
|||||||
new webpack.optimize.OccurenceOrderPlugin(),
|
new webpack.optimize.OccurenceOrderPlugin(),
|
||||||
new webpack.optimize.AggressiveMergingPlugin(),
|
new webpack.optimize.AggressiveMergingPlugin(),
|
||||||
new webpack.NoErrorsPlugin()
|
new webpack.NoErrorsPlugin()
|
||||||
]
|
],
|
||||||
}, baseConfig);
|
module: defaultSettings.getDefaultModules()
|
||||||
|
});
|
||||||
|
|
||||||
|
// Add needed loaders to the defaults here
|
||||||
config.module.loaders.push({
|
config.module.loaders.push({
|
||||||
test: /\.(js|jsx)$/,
|
test: /\.(js|jsx)$/,
|
||||||
loader: 'babel',
|
loader: 'babel',
|
||||||
include: path.join(__dirname, '/../src')
|
include: [].concat(
|
||||||
|
config.additionalPaths,
|
||||||
|
[ path.join(__dirname, '/../src') ]
|
||||||
|
)
|
||||||
});
|
});
|
||||||
|
|
||||||
module.exports = config;
|
module.exports = config;
|
||||||
|
|||||||
+23
-15
@@ -1,12 +1,25 @@
|
|||||||
var path = require('path');
|
'use strict';
|
||||||
var srcPath = path.join(__dirname, '/../src/');
|
|
||||||
|
let path = require('path');
|
||||||
|
let srcPath = path.join(__dirname, '/../src/');
|
||||||
|
|
||||||
|
let baseConfig = require('./base');
|
||||||
|
|
||||||
// Add needed plugins here
|
// Add needed plugins here
|
||||||
var BowerWebpackPlugin = require('bower-webpack-plugin');
|
let BowerWebpackPlugin = require('bower-webpack-plugin');
|
||||||
|
|
||||||
module.exports = {
|
module.exports = {
|
||||||
devtool: 'eval',
|
devtool: 'eval',
|
||||||
module: {
|
module: {
|
||||||
|
preLoaders: [
|
||||||
|
{
|
||||||
|
test: /\.(js|jsx)$/,
|
||||||
|
loader: 'isparta-instrumenter-loader',
|
||||||
|
include: [
|
||||||
|
path.join(__dirname, '/../src')
|
||||||
|
]
|
||||||
|
}
|
||||||
|
],
|
||||||
loaders: [
|
loaders: [
|
||||||
{
|
{
|
||||||
test: /\.(png|jpg|gif|woff|woff2|css|sass|scss|less|styl)$/,
|
test: /\.(png|jpg|gif|woff|woff2|css|sass|scss|less|styl)$/,
|
||||||
@@ -15,18 +28,13 @@ module.exports = {
|
|||||||
{
|
{
|
||||||
test: /\.(js|jsx)$/,
|
test: /\.(js|jsx)$/,
|
||||||
loader: 'babel-loader',
|
loader: 'babel-loader',
|
||||||
include: [
|
include: [].concat(
|
||||||
path.join(__dirname, '/../src'),
|
baseConfig.additionalPaths,
|
||||||
path.join(__dirname, '/../test')
|
[
|
||||||
]
|
path.join(__dirname, '/../src'),
|
||||||
},
|
path.join(__dirname, '/../test')
|
||||||
{
|
]
|
||||||
test: /\.(js|jsx)$/,
|
)
|
||||||
loader: 'babel-loader',
|
|
||||||
include: [
|
|
||||||
path.join(__dirname, '/../src')
|
|
||||||
],
|
|
||||||
loader: 'isparta'
|
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
|
|||||||
Binary file not shown.
|
Before Width: | Height: | Size: 13 KiB |
+6
-3
@@ -9,7 +9,7 @@ module.exports = function(config) {
|
|||||||
],
|
],
|
||||||
port: 8080,
|
port: 8080,
|
||||||
captureTimeout: 60000,
|
captureTimeout: 60000,
|
||||||
frameworks: [ 'phantomjs-shim', 'mocha', 'chai' ],
|
frameworks: [ 'mocha', 'chai' ],
|
||||||
client: {
|
client: {
|
||||||
mocha: {}
|
mocha: {}
|
||||||
},
|
},
|
||||||
@@ -23,8 +23,11 @@ module.exports = function(config) {
|
|||||||
noInfo: true
|
noInfo: true
|
||||||
},
|
},
|
||||||
coverageReporter: {
|
coverageReporter: {
|
||||||
type: 'html',
|
dir: 'coverage/',
|
||||||
dir: 'coverage/'
|
reporters: [
|
||||||
|
{ type: 'html' },
|
||||||
|
{ type: 'text' }
|
||||||
|
]
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|||||||
+18
-15
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "react-webpack-template",
|
"name": "react-webpack-template",
|
||||||
"version": "0.3.2",
|
"version": "1.5.3",
|
||||||
"description": "A base skeleton template for react and webpack without task runners",
|
"description": "A base skeleton template for react and webpack without task runners",
|
||||||
"main": "server.js",
|
"main": "server.js",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
@@ -36,32 +36,36 @@
|
|||||||
},
|
},
|
||||||
"homepage": "https://github.com/weblogixx/react-webpack-template#readme",
|
"homepage": "https://github.com/weblogixx/react-webpack-template#readme",
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"babel-core": "^5.8.22",
|
"babel-core": "^6.0.0",
|
||||||
"babel-loader": "^5.3.2",
|
"babel-eslint": "^6.0.0",
|
||||||
|
"babel-loader": "^6.0.0",
|
||||||
|
"babel-polyfill": "^6.3.14",
|
||||||
|
"babel-preset-es2015": "^6.0.15",
|
||||||
|
"babel-preset-react": "^6.0.15",
|
||||||
"bower-webpack-plugin": "^0.1.9",
|
"bower-webpack-plugin": "^0.1.9",
|
||||||
"chai": "^3.2.0",
|
"chai": "^3.2.0",
|
||||||
"copyfiles": "^0.2.1",
|
"copyfiles": "^0.2.1",
|
||||||
"css-loader": "^0.21.0",
|
"css-loader": "^0.23.0",
|
||||||
"eslint": "^1.2.1",
|
"eslint": "^2.2.0",
|
||||||
"eslint-loader": "^1.0.0",
|
"eslint-loader": "^1.0.0",
|
||||||
"eslint-plugin-react": "^3.3.0",
|
"eslint-plugin-react": "^4.0.0",
|
||||||
"file-loader": "^0.8.4",
|
"file-loader": "^0.8.4",
|
||||||
"glob": "^5.0.15",
|
"glob": "^7.0.0",
|
||||||
"isparta-loader": "^1.0.0",
|
"isparta-instrumenter-loader": "^1.0.0",
|
||||||
"karma": "^0.13.9",
|
"karma": "^0.13.9",
|
||||||
"karma-chai": "^0.1.0",
|
"karma-chai": "^0.1.0",
|
||||||
"karma-coverage": "^0.5.3",
|
"karma-coverage": "^0.5.3",
|
||||||
"karma-mocha": "^0.2.0",
|
"karma-mocha": "^0.2.0",
|
||||||
"karma-mocha-reporter": "^1.1.1",
|
"karma-mocha-reporter": "^2.0.0",
|
||||||
"karma-phantomjs-launcher": "^0.2.1",
|
"karma-phantomjs-launcher": "^1.0.0",
|
||||||
"karma-phantomjs-shim": "^1.1.1",
|
|
||||||
"karma-sourcemap-loader": "^0.3.5",
|
"karma-sourcemap-loader": "^0.3.5",
|
||||||
"karma-webpack": "^1.7.0",
|
"karma-webpack": "^1.7.0",
|
||||||
"minimist": "^1.2.0",
|
"minimist": "^1.2.0",
|
||||||
"mocha": "^2.2.5",
|
"mocha": "^2.2.5",
|
||||||
"null-loader": "^0.1.1",
|
"null-loader": "^0.1.1",
|
||||||
"open": "0.0.5",
|
"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",
|
"react-hot-loader": "^1.2.9",
|
||||||
"rimraf": "^2.4.3",
|
"rimraf": "^2.4.3",
|
||||||
"style-loader": "^0.13.0",
|
"style-loader": "^0.13.0",
|
||||||
@@ -70,10 +74,9 @@
|
|||||||
"webpack-dev-server": "^1.12.0"
|
"webpack-dev-server": "^1.12.0"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"lodash": "^3.10.1",
|
"core-js": "^2.0.0",
|
||||||
"normalize.css": "^3.0.3",
|
"normalize.css": "^4.0.0",
|
||||||
"react": "^0.14.0",
|
"react": "^0.14.0",
|
||||||
"react-addons-test-utils": "^0.14.0",
|
|
||||||
"react-dom": "^0.14.0"
|
"react-dom": "^0.14.0"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,11 +1,13 @@
|
|||||||
/*eslint no-console:0 */
|
/*eslint no-console:0 */
|
||||||
var webpack = require('webpack');
|
'use strict';
|
||||||
var WebpackDevServer = require('webpack-dev-server');
|
require('core-js/fn/object/assign');
|
||||||
var config = require('./webpack.config');
|
const webpack = require('webpack');
|
||||||
var open = require('open');
|
const WebpackDevServer = require('webpack-dev-server');
|
||||||
|
const config = require('./webpack.config');
|
||||||
|
const open = require('open');
|
||||||
|
|
||||||
new WebpackDevServer(webpack(config), config.devServer)
|
new WebpackDevServer(webpack(config), config.devServer)
|
||||||
.listen(config.port, 'localhost', function(err) {
|
.listen(config.port, 'localhost', (err) => {
|
||||||
if (err) {
|
if (err) {
|
||||||
console.log(err);
|
console.log(err);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,4 +1,4 @@
|
|||||||
require('normalize.css');
|
require('normalize.css/normalize.css');
|
||||||
require('styles/App.css');
|
require('styles/App.css');
|
||||||
|
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
|
|||||||
@@ -0,0 +1,5 @@
|
|||||||
|
'use strict';
|
||||||
|
|
||||||
|
// Settings configured here will be merged into the final config object.
|
||||||
|
export default {
|
||||||
|
}
|
||||||
+4
-2
@@ -1,7 +1,9 @@
|
|||||||
'use strict';
|
'use strict';
|
||||||
|
|
||||||
const config = {
|
import baseConfig from './base';
|
||||||
|
|
||||||
|
let config = {
|
||||||
appEnv: 'dev' // feel free to remove the appEnv property here
|
appEnv: 'dev' // feel free to remove the appEnv property here
|
||||||
};
|
};
|
||||||
|
|
||||||
export default config;
|
export default Object.freeze(Object.assign({}, baseConfig, config));
|
||||||
|
|||||||
+4
-2
@@ -1,7 +1,9 @@
|
|||||||
'use strict';
|
'use strict';
|
||||||
|
|
||||||
const config = {
|
import baseConfig from './base';
|
||||||
|
|
||||||
|
let config = {
|
||||||
appEnv: 'dist' // feel free to remove the appEnv property here
|
appEnv: 'dist' // feel free to remove the appEnv property here
|
||||||
};
|
};
|
||||||
|
|
||||||
export default config;
|
export default Object.freeze(Object.assign({}, baseConfig, config));
|
||||||
|
|||||||
+4
-2
@@ -1,7 +1,9 @@
|
|||||||
'use strict';
|
'use strict';
|
||||||
|
|
||||||
const config = {
|
import baseConfig from './base';
|
||||||
|
|
||||||
|
let config = {
|
||||||
appEnv: 'test' // don't remove the appEnv property here
|
appEnv: 'test' // don't remove the appEnv property here
|
||||||
};
|
};
|
||||||
|
|
||||||
export default config;
|
export default Object.freeze(Object.assign(baseConfig, config));
|
||||||
|
|||||||
+1
-1
@@ -11,6 +11,6 @@
|
|||||||
<div id="app">APPLICATION CONTENT</div>
|
<div id="app">APPLICATION CONTENT</div>
|
||||||
|
|
||||||
<script>__REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__</script>
|
<script>__REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__</script>
|
||||||
<script type="text/javascript" src="assets/app.js"></script>
|
<script type="text/javascript" src="./assets/app.js"></script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
@@ -1,6 +1,7 @@
|
|||||||
|
import 'core-js/fn/object/assign';
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import ReactDOM from 'react-dom';
|
import ReactDOM from 'react-dom';
|
||||||
import App from './Main';
|
import App from './components/Main';
|
||||||
|
|
||||||
// Render the main component into the dom
|
// Render the main component into the dom
|
||||||
ReactDOM.render(<App />, document.getElementById('app'));
|
ReactDOM.render(<App />, document.getElementById('app'));
|
||||||
@@ -11,13 +11,13 @@ import createComponent from 'helpers/shallowRenderHelper';
|
|||||||
import Main from 'components/Main';
|
import Main from 'components/Main';
|
||||||
|
|
||||||
describe('MainComponent', () => {
|
describe('MainComponent', () => {
|
||||||
let MainComponent;
|
let MainComponent;
|
||||||
|
|
||||||
beforeEach(() => {
|
beforeEach(() => {
|
||||||
MainComponent = createComponent(Main);
|
MainComponent = createComponent(Main);
|
||||||
});
|
});
|
||||||
|
|
||||||
it('should have its component name as default className', () => {
|
it('should have its component name as default className', () => {
|
||||||
expect(MainComponent.props.className).to.equal('index');
|
expect(MainComponent.props.className).to.equal('index');
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -1,5 +1,8 @@
|
|||||||
'use strict';
|
'use strict';
|
||||||
|
|
||||||
|
require('babel-polyfill');
|
||||||
|
require('core-js/fn/object/assign');
|
||||||
|
|
||||||
// Add support for all files in the test directory
|
// Add support for all files in the test directory
|
||||||
const testsContext = require.context('.', true, /(Test\.js$)|(Helper\.js$)/);
|
const testsContext = require.context('.', true, /(Test\.js$)|(Helper\.js$)/);
|
||||||
testsContext.keys().forEach(testsContext);
|
testsContext.keys().forEach(testsContext);
|
||||||
|
|||||||
+10
-26
@@ -1,14 +1,14 @@
|
|||||||
'use strict';
|
'use strict';
|
||||||
|
|
||||||
var path = require('path');
|
const path = require('path');
|
||||||
var args = require('minimist')(process.argv.slice(2));
|
const args = require('minimist')(process.argv.slice(2));
|
||||||
|
|
||||||
// List of allowed environments
|
// List of allowed environments
|
||||||
var allowedEnvs = ['dev', 'dist', 'test'];
|
const allowedEnvs = ['dev', 'dist', 'test'];
|
||||||
|
|
||||||
// Set the correct environment
|
// Set the correct environment
|
||||||
var env;
|
var env;
|
||||||
if(args._.length > 0 && args._.indexOf('start') !== -1) {
|
if (args._.length > 0 && args._.indexOf('start') !== -1) {
|
||||||
env = 'test';
|
env = 'test';
|
||||||
} else if (args.env) {
|
} else if (args.env) {
|
||||||
env = args.env;
|
env = args.env;
|
||||||
@@ -17,32 +17,16 @@ if(args._.length > 0 && args._.indexOf('start') !== -1) {
|
|||||||
}
|
}
|
||||||
process.env.REACT_WEBPACK_ENV = env;
|
process.env.REACT_WEBPACK_ENV = env;
|
||||||
|
|
||||||
// Get available configurations
|
|
||||||
var configs = {
|
|
||||||
base: require(path.join(__dirname, 'cfg/base')),
|
|
||||||
dev: require(path.join(__dirname, 'cfg/dev')),
|
|
||||||
dist: require(path.join(__dirname, 'cfg/dist')),
|
|
||||||
test: require(path.join(__dirname, 'cfg/test'))
|
|
||||||
};
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Get an allowed environment
|
|
||||||
* @param {String} env
|
|
||||||
* @return {String}
|
|
||||||
*/
|
|
||||||
function getValidEnv(env) {
|
|
||||||
var isValid = env && env.length > 0 && allowedEnvs.indexOf(env) !== -1;
|
|
||||||
return isValid ? env : 'dev';
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Build the webpack configuration
|
* Build the webpack configuration
|
||||||
* @param {String} env Environment to use
|
* @param {String} wantedEnv The wanted environment
|
||||||
* @return {Object} Webpack config
|
* @return {Object} Webpack config
|
||||||
*/
|
*/
|
||||||
function buildConfig(env) {
|
function buildConfig(wantedEnv) {
|
||||||
var usedEnv = getValidEnv(env);
|
let isValid = wantedEnv && wantedEnv.length > 0 && allowedEnvs.indexOf(wantedEnv) !== -1;
|
||||||
return configs[usedEnv];
|
let validEnv = isValid ? wantedEnv : 'dev';
|
||||||
|
let config = require(path.join(__dirname, 'cfg/' + validEnv));
|
||||||
|
return config;
|
||||||
}
|
}
|
||||||
|
|
||||||
module.exports = buildConfig(env);
|
module.exports = buildConfig(env);
|
||||||
|
|||||||
Reference in New Issue
Block a user