archive-gh-me/generator-react-webpack
1
0
Fork 0
mirror of https://github.com/react-webpack-generators/generator-react-webpack.git synced 2025-12-08 18:01:59 +00:00
Code Issues Projects Releases Wiki Activity

Merge branch 'master' of https://github.com/newtriks/generator-react-webpack

Browse Source 
Conflicts:
	package.json
This commit is contained in:
Yonatan Schreiber 2015-04-19 15:11:19 +03:00
commit c6e140300e
10 changed files with 53 additions and 55 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
README.md
View File

@ -57,7 +57,7 @@ Example:
yo react-webpack:component foo //or just: yo react-webpack:c foo
```
Produces `src/scripts/components/Foo.js` (*javascript - JSX*):
Produces `src/components/Foo.js` (*javascript - JSX*):
```
'use strict';
@ -86,7 +86,7 @@ describe('Foo', function () {
var Foo, component;
beforeEach(function () {
Foo = require('../../../src/scripts/components/Foo');
Foo = require('../../../src/components/Foo');
component = Foo();
});
@ -144,13 +144,13 @@ Just remove those you don't need, then fill and space out the rest.
### Action
When using Flux or Reflux architecture, it generates an actionCreator in `src/scripts/actions` and it's corresponding test in `src/spec/actions`.
When using Flux or Reflux architecture, it generates an actionCreator in `src/actions` and it's corresponding test in `src/spec/actions`.
Example:
```bash
yo react-webpack:action bar //or just: yo react-webpack:a bar
```
Will create a file - `src/scripts/actions/BarActionCreators.js`
Will create a file - `src/actions/BarActionCreators.js`
if 'architecture' is **Flux**, it Produces :
```
@ -195,13 +195,13 @@ describe('BarActionCreators', function() {
### Store
When using Flux or Reflux architecture, it generates a store in `src/scripts/stores` and it's corresponding test in `src/spec/stores`.
When using Flux or Reflux architecture, it generates a store in `src/stores` and it's corresponding test in `src/spec/stores`.
Example:
```bash
yo react-webpack:store baz //or just: yo react-webpack:s baz
```
Will create a file - `src/scripts/stores/BazStore.js`
Will create a file - `src/stores/BazStore.js`
if 'architecture' is **Flux**, it Produces :
```
@ -295,20 +295,19 @@ The react-webpack generator automates the setup of a [ReactJS](http://facebook.g
```
project
- src
- scripts
-components
MainApp.js
Foo.js
AnotherComponent.js
-components
MainApp.js
Foo.js
AnotherComponent.js
//for flux/reflux
-actions
BarActionCreators.js
-stores
BazStore.js
//for flux
-dispatcher
FooAppDispatcher
//for flux/reflux
-actions
BarActionCreators.js
-stores
BazStore.js
//for flux
-dispatcher
FooAppDispatcher
- styles
main.css
@ -351,14 +350,14 @@ Each component is a module and can be required using the [Webpack](http://webpac
Out the box the [Gruntfile](http://gruntjs.com/api/grunt.file) is configured with the following:
1. **webpack**: uses the [grunt-webpack](https://github.com/webpack/grunt-webpack) plugin to load all required modules and output to a single JS file `src/scripts/main.js`. This is included in the `src/index.html` file by default and will reload in the browser as and when it is recompiled.
1. **webpack**: uses the [grunt-webpack](https://github.com/webpack/grunt-webpack) plugin to load all required modules and output to a single JS file `src/main.js`. This is included in the `src/index.html` file by default and will reload in the browser as and when it is recompiled.
2. **webpack-dev-server**: uses the [webpack-dev-server](https://github.com/webpack/webpack-dev-server) to watch for file changes and also serve the webpack app in development.
3. **connect**: uses the [grunt-connect](https://github.com/gruntjs/grunt-contrib-connect) plugin to start a webserver at [localhost](http://localhost:8000).
4. **karma**: uses the [grunt-karma](https://github.com/karma-runner/grunt-karma) plugin to load the Karma configuration file `karma.conf.js` located in the project root. This will run all tests using [PhantomJS](http://phantomjs.org/) by default but supports many other browsers.
### CSS
Included in the project is the [normalize.css](http://necolas.github.io/normalize.css/) script. There is also a `src/styles/main.css` script that's required by the core `src/scripts/components/App.js` component using Webpack.
Included in the project is the [normalize.css](http://necolas.github.io/normalize.css/) script. There is also a `src/styles/main.css` script that's required by the core `src/components/App.js` component using Webpack.
### JSHint

4
package.json
View File

@ -1,6 +1,6 @@
{
"name": "generator-react-webpack",
"version": "1.2.1",
"name": "generator-react-webpack",
"version": "1.2.2",
"description": "Yeoman generator for Facebook's ReactJS, with webpack, livereload, grunt, Flux/Reflux architecture options and support for sass, less or stylus ",
"keywords": [
"yeoman-generator",

2
script-base.js
View File

@ -23,7 +23,7 @@ var Generator = module.exports = function Generator() {
this.architecture = this.config.get('architecture');
if (typeof this.options.appPath === 'undefined') {
this.options.appPath = this.options.appPath || 'src/scripts';
this.options.appPath = this.options.appPath || 'src';
}
if (typeof this.options.testPath === 'undefined') {

7
templates/common/Gruntfile.js
View File

@ -19,7 +19,6 @@ module.exports = function (grunt) {
webpack: {
options: webpackDistConfig,
dist: {
cache: false
}
@ -31,11 +30,11 @@ module.exports = function (grunt) {
port: 8000,
webpack: webpackDevConfig,
publicPath: '/assets/',
contentBase: './<%= pkg.src %>/',
contentBase: './<%= pkg.src %>/'
},
start: {
keepAlive: true,
keepAlive: true
}
},
@ -90,7 +89,7 @@ module.exports = function (grunt) {
expand: true,
src: ['<%= pkg.src %>/images/*'],
dest: '<%= pkg.dist %>/images/'
},
}
]
}
},

10
templates/common/_webpack.config.js
View File

@ -19,7 +19,7 @@ module.exports = {
devtool: false,
entry: [
'webpack/hot/only-dev-server',
'./src/scripts/components/<% if (reactRouter) { %>main<% } else { %><%= scriptAppName %><% } %>.js'
'./src/components/<% if (reactRouter) { %>main<% } else { %><%= scriptAppName %><% } %>.js'
],
stats: {
@ -31,10 +31,10 @@ module.exports = {
extensions: ['', '.js'],
alias: {
'styles': __dirname + '/src/styles',
'mixins': __dirname + '/src/scripts/mixins',
'components': __dirname + '/src/scripts/components/'<% if(architecture==='flux'||architecture=='reflux') { %>,
'stores': __dirname + '/src/scripts/stores/',
'actions': __dirname + '/src/scripts/actions/'<% } %>
'mixins': __dirname + '/src/mixins',
'components': __dirname + '/src/components/'<% if(architecture==='flux'||architecture=='reflux') { %>,
'stores': __dirname + '/src/stores/',
'actions': __dirname + '/src/actions/'<% } %>
}
},
module: {

10
templates/common/_webpack.dist.config.js
View File

@ -18,7 +18,7 @@ module.exports = {
debug: false,
devtool: false,
entry: './src/scripts/components/<% if (reactRouter) { %>main<% } else { %><%= scriptAppName %><% } %>.js',
entry: './src/components/<% if (reactRouter) { %>main<% } else { %><%= scriptAppName %><% } %>.js',
stats: {
colors: true,
@ -36,10 +36,10 @@ module.exports = {
extensions: ['', '.js'],
alias: {
'styles': __dirname + '/src/styles',
'mixins': __dirname + '/src/scripts/mixins',
'components': __dirname + '/src/scripts/components/'<% if(architecture==='flux'||architecture=='reflux') { %>,
'stores': __dirname + '/src/scripts/stores/',
'actions': __dirname + '/src/scripts/actions/'<% } %>
'mixins': __dirname + '/src/mixins',
'components': __dirname + '/src/components/'<% if(architecture==='flux'||architecture=='reflux') { %>,
'stores': __dirname + '/src/stores/',
'actions': __dirname + '/src/actions/'<% } %>
}
},

2
templates/common/gitignore
View File

@ -30,4 +30,4 @@ $RECYCLE.BIN/
node_modules/
.tmp
dist
/src/scripts/main.js
/src/main.js

6
templates/common/karma.conf.js
View File

@ -52,9 +52,9 @@ module.exports = function (config) {
resolve: {
alias: {
'styles': path.join(process.cwd(), './src/styles/'),
'components': path.join(process.cwd(), './src/scripts/components/')<% if(architecture === 'flux'||architecture === 'reflux') { %>,
'stores': '../../../src/scripts/stores/',
'actions': '../../../src/scripts/actions/'<% } %>
'components': path.join(process.cwd(), './src/components/')<% if(architecture === 'flux'||architecture === 'reflux') { %>,
'stores': '../../../src/stores/',
'actions': '../../../src/actions/'<% } %>
}
}
},

4
templates/javascript/App.js
View File

@ -5,9 +5,9 @@ var ReactTransitionGroup = React.addons.TransitionGroup;
// CSS
require('normalize.css');
require('../../styles/main.css');
require('../styles/main.css');
var imageURL = require('../../images/yeoman.png');
var imageURL = require('../images/yeoman.png');
var <%= scriptAppName %> = React.createClass({
render: function() {

22
test/test-creation.js
View File

@ -71,8 +71,8 @@ describe('react-webpack generator', function() {
react.run({}, function() {
setTimeout(function() {
helpers.assertFile([].concat(expected, [
'src/scripts/components/TempTestApp.js',
'src/scripts/components/main.js'
'src/components/TempTestApp.js',
'src/components/main.js'
]));
done();
});
@ -135,7 +135,7 @@ describe('react-webpack generator', function() {
['webpack.dist.config.js', /resolve[\S\s]+alias[\S\s]+stores/m]
]);
assert.noFile('src/scripts/dispatcher/TempTestAppDispatcher.js');
assert.noFile('src/dispatcher/TempTestAppDispatcher.js');
done();
});
@ -227,7 +227,7 @@ describe('react-webpack generator', function() {
it('should have a Dispatcher generated', function(done) {
setTimeout(function(){
assert.file('src/scripts/dispatcher/TempTestAppDispatcher.js');
assert.file('src/dispatcher/TempTestAppDispatcher.js');
done();
});
@ -238,7 +238,7 @@ describe('react-webpack generator', function() {
var generatorTest = function(name, generatorType, specType, targetDirectory, scriptNameFn, specNameFn, suffix, done) {
var deps = [path.join('../..', generatorType)];
genOptions.appPath = 'src/scripts'
genOptions.appPath = 'src';
var reactGenerator = helpers.createGenerator('react-webpack:' + generatorType, deps, [name], genOptions);
@ -246,8 +246,8 @@ describe('react-webpack generator', function() {
reactGenerator.run([], function() {
helpers.assertFileContent([
[path.join('src/scripts', targetDirectory, name + '.js'), new RegExp('var ' + scriptNameFn(name) + suffix, 'g')],
[path.join('src/scripts', targetDirectory, name + '.js'), new RegExp('require\\(\'styles\\/' + name + suffix + '\\.[^\']+' + '\'\\)', 'g')],
[path.join('src', targetDirectory, name + '.js'), new RegExp('var ' + scriptNameFn(name) + suffix, 'g')],
[path.join('src', targetDirectory, name + '.js'), new RegExp('require\\(\'styles\\/' + name + suffix + '\\.[^\']+' + '\'\\)', 'g')],
[path.join('test/spec', targetDirectory, 'TempTestApp' + '.js'), new RegExp('require\\(\'components\\/' + 'TempTestApp' + suffix + '\\.[^\']+' + '\'\\)', 'g')],
[path.join('test/spec', targetDirectory, name + '.js'), new RegExp('require\\(\'components\\/' + name + suffix + '\\.[^\']+' + '\'\\)', 'g')],
[path.join('test/spec', targetDirectory, name + '.js'), new RegExp('describe\\(\'' + specNameFn(name) + suffix + '\'', 'g')]
@ -286,7 +286,7 @@ describe('react-webpack generator', function() {
'react-webpack:action',
[path.join('../../action')],
['Test'],
{ appPath: 'src/scripts' }
{ appPath: 'src' }
);
react.run([], function() {
@ -299,7 +299,7 @@ describe('react-webpack generator', function() {
it('should generate a new action with tests', function(done) {
assert.fileContent([
['src/scripts/actions/TestActionCreators.js', /var TestActionCreators/g],
['src/actions/TestActionCreators.js', /var TestActionCreators/g],
['test/spec/actions/TestActionCreators.js', /require\('actions\/TestActionCreators.js'\)/g],
['test/spec/actions/TestActionCreators.js', /describe\('TestActionCreators'/g]
]);
@ -321,7 +321,7 @@ describe('react-webpack generator', function() {
'react-webpack:store',
[path.join('../../store')],
['Test'],
{ appPath: 'src/scripts' }
{ appPath: 'src' }
);
react.run([], function() {
@ -334,7 +334,7 @@ describe('react-webpack generator', function() {
it('should generate a new store with tests', function(done) {
assert.fileContent([
['src/scripts/stores/TestStore.js', /var TestStore/g],
['src/stores/TestStore.js', /var TestStore/g],
['test/spec/stores/TestStore.js', /require\('stores\/TestStore.js'\)/g],
['test/spec/stores/TestStore.js', /describe\('TestStore'/g]
]);