mirror of
https://github.com/wassname/generator-react-webpack.git
synced 2026-10-04 12:40:26 +08:00
add 'architecture' question, Reflux option, and related store and actionCreator
This commit is contained in:
1 parent
356df8ec9a
commit
f7bb3c2b80
15 files changed
+107
-42
No files matched your search
+2
-1
@@ -12,4 +12,5 @@ Desktop.ini
|
|||||||
$RECYCLE.BIN/
|
$RECYCLE.BIN/
|
||||||
node_modules/
|
node_modules/
|
||||||
/test/*
|
/test/*
|
||||||
npm-debug.log
|
npm-debug.log
|
||||||
|
.idea/
|
||||||
+15
-8
@@ -5,22 +5,29 @@ var ScriptBase = require('../script-base.js');
|
|||||||
var ActionGenerator = module.exports = function ActionGenerator(args, options, config) {
|
var ActionGenerator = module.exports = function ActionGenerator(args, options, config) {
|
||||||
args[0] += 'ActionCreators';
|
args[0] += 'ActionCreators';
|
||||||
ScriptBase.apply(this, arguments);
|
ScriptBase.apply(this, arguments);
|
||||||
}
|
};
|
||||||
|
|
||||||
util.inherits(ActionGenerator, ScriptBase);
|
util.inherits(ActionGenerator, ScriptBase);
|
||||||
|
|
||||||
ActionGenerator.prototype.createActionFile = function createActionFile() {
|
ActionGenerator.prototype.createActionFile = function createActionFile() {
|
||||||
this.option('es6');
|
this.option('es6');
|
||||||
|
|
||||||
this.es6 = this.options.es6;
|
this.es6 = this.options.es6;
|
||||||
|
|
||||||
console.log(this.name);
|
var actionTemplate;
|
||||||
|
switch (this.architecture){
|
||||||
|
case 'flux':
|
||||||
|
actionTemplate = 'FluxAction';
|
||||||
|
break;
|
||||||
|
case 'reflux':
|
||||||
|
actionTemplate = 'RefluxAction';
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
|
||||||
|
console.log('Creating ' + this.architecture + ' action');
|
||||||
|
|
||||||
this.generateSourceAndTest(
|
this.generateSourceAndTest(
|
||||||
'Action',
|
actionTemplate,
|
||||||
'spec/Action',
|
'spec/Action',
|
||||||
void(0),
|
'actions'
|
||||||
'actions',
|
|
||||||
false
|
|
||||||
);
|
);
|
||||||
}
|
};
|
||||||
+12
-7
@@ -66,16 +66,21 @@ ReactWebpackGenerator.prototype.askForReactRouter = function () {
|
|||||||
}.bind(this));
|
}.bind(this));
|
||||||
};
|
};
|
||||||
|
|
||||||
ReactWebpackGenerator.prototype.askForFlux = function() {
|
ReactWebpackGenerator.prototype.askForArchitecture = function() {
|
||||||
var done = this.async();
|
var done = this.async();
|
||||||
this.prompt({
|
this.prompt({
|
||||||
type : 'confirm',
|
type : 'list',
|
||||||
name : 'flux',
|
name : 'architecture',
|
||||||
message : 'Would you like to include flux?',
|
message : 'Would you like to use one of those architectures?',
|
||||||
|
choices: [
|
||||||
|
{name:'No need for that, thanks',value:false},
|
||||||
|
{name:'Flux',value:'flux'},
|
||||||
|
{name:'ReFlux',value:'reflux'}
|
||||||
|
],
|
||||||
default : false
|
default : false
|
||||||
}, function(props) {
|
}, function(props) {
|
||||||
this.env.options.flux = props.flux;
|
this.env.options.architecture = props.architecture;
|
||||||
this.config.set('flux', props.flux);
|
this.config.set('architecture', props.architecture);
|
||||||
done();
|
done();
|
||||||
}.bind(this));
|
}.bind(this));
|
||||||
};
|
};
|
||||||
@@ -113,7 +118,7 @@ ReactWebpackGenerator.prototype.createIndexHtml = function createIndexHtml() {
|
|||||||
ReactWebpackGenerator.prototype.packageFiles = function () {
|
ReactWebpackGenerator.prototype.packageFiles = function () {
|
||||||
this.es6 = this.options.es6;
|
this.es6 = this.options.es6;
|
||||||
this.reactRouter = this.env.options.reactRouter;
|
this.reactRouter = this.env.options.reactRouter;
|
||||||
this.flux = this.env.options.flux;
|
this.architecture = this.env.options.architecture;
|
||||||
this.stylesLanguage = this.env.options.stylesLanguage;
|
this.stylesLanguage = this.env.options.stylesLanguage;
|
||||||
this.template('../../templates/common/_package.json', 'package.json');
|
this.template('../../templates/common/_package.json', 'package.json');
|
||||||
this.template('../../templates/common/_webpack.config.js', 'webpack.config.js');
|
this.template('../../templates/common/_webpack.config.js', 'webpack.config.js');
|
||||||
|
|||||||
+1
-1
@@ -13,7 +13,7 @@ ComponentGenerator.prototype.createComponentFile = function createComponentFile(
|
|||||||
|
|
||||||
this.es6 = this.options.es6;
|
this.es6 = this.options.es6;
|
||||||
|
|
||||||
this.generateSourceAndTest(
|
this.generateComponentTestAndStyle(
|
||||||
'Component',
|
'Component',
|
||||||
'spec/Component',
|
'spec/Component',
|
||||||
'styles/Component',
|
'styles/Component',
|
||||||
|
|||||||
+1
-1
@@ -22,7 +22,7 @@ MainGenerator.prototype.createMainFile = function createMainFile() {
|
|||||||
};
|
};
|
||||||
|
|
||||||
MainGenerator.prototype.createDispatcher = function createDispatcher() {
|
MainGenerator.prototype.createDispatcher = function createDispatcher() {
|
||||||
if(this.env.options.flux) {
|
if(this.env.options.architecture=='flux') {
|
||||||
this.appTemplate('Dispatcher', 'dispatcher/' + this.scriptAppName + 'Dispatcher');
|
this.appTemplate('Dispatcher', 'dispatcher/' + this.scriptAppName + 'Dispatcher');
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
+15
-2
@@ -20,6 +20,7 @@ var Generator = module.exports = function Generator() {
|
|||||||
this.classedFileName = this._.capitalizeFile(this.name);
|
this.classedFileName = this._.capitalizeFile(this.name);
|
||||||
this.classedName = this._.capitalizeClass(this.name);
|
this.classedName = this._.capitalizeClass(this.name);
|
||||||
this.stylesLanguage = this.config.get('styles-language');
|
this.stylesLanguage = this.config.get('styles-language');
|
||||||
|
this.architecture = this.config.get('architecture');
|
||||||
|
|
||||||
if (typeof this.options.appPath === 'undefined') {
|
if (typeof this.options.appPath === 'undefined') {
|
||||||
this.options.appPath = this.options.appPath || 'src/scripts';
|
this.options.appPath = this.options.appPath || 'src/scripts';
|
||||||
@@ -60,6 +61,13 @@ var Generator = module.exports = function Generator() {
|
|||||||
util.inherits(Generator, yeoman.generators.NamedBase);
|
util.inherits(Generator, yeoman.generators.NamedBase);
|
||||||
|
|
||||||
Generator.prototype.appTemplate = function (src, dest) {
|
Generator.prototype.appTemplate = function (src, dest) {
|
||||||
|
yeoman.generators.Base.prototype.template.apply(this, [
|
||||||
|
path.join('javascript', src + this.scriptSuffix),
|
||||||
|
path.join(this.options.appPath, dest) + this.scriptSuffix
|
||||||
|
]);
|
||||||
|
};
|
||||||
|
|
||||||
|
Generator.prototype.reactComponentTemplate = function (src, dest) {
|
||||||
yeoman.generators.Base.prototype.template.apply(this, [
|
yeoman.generators.Base.prototype.template.apply(this, [
|
||||||
path.join('javascript', src + this.reactSuffix),
|
path.join('javascript', src + this.reactSuffix),
|
||||||
path.join(this.options.appPath, dest) + this.reactSuffix
|
path.join(this.options.appPath, dest) + this.reactSuffix
|
||||||
@@ -88,8 +96,13 @@ Generator.prototype.htmlTemplate = function (src, dest) {
|
|||||||
]);
|
]);
|
||||||
};
|
};
|
||||||
|
|
||||||
Generator.prototype.generateSourceAndTest = function (appTemplate, testTemplate, stylesTemplate, targetDirectory, includeStyles) {
|
Generator.prototype.generateSourceAndTest = function (appTemplate, testTemplate, targetDirectory) {
|
||||||
this.appTemplate(appTemplate, path.join(targetDirectory, this._.capitalizeFile(this.name)));
|
this.appTemplate(appTemplate, path.join(targetDirectory, this._.capitalizeFile(this.name)));
|
||||||
this.testTemplate(testTemplate, path.join(targetDirectory, this._.capitalizeFile(this.name)));
|
this.testTemplate(testTemplate, path.join(targetDirectory, this._.capitalizeFile(this.name)));
|
||||||
if(includeStyles) this.stylesTemplate(stylesTemplate, path.join(this._.capitalizeFile(this.name)));
|
};
|
||||||
|
|
||||||
|
Generator.prototype.generateComponentTestAndStyle = function (componentTemplate, testTemplate, stylesTemplate, targetDirectory) {
|
||||||
|
this.reactComponentTemplate(componentTemplate, path.join(targetDirectory, this._.capitalizeFile(this.name)));
|
||||||
|
this.testTemplate(testTemplate, path.join(targetDirectory, this._.capitalizeFile(this.name)));
|
||||||
|
this.stylesTemplate(stylesTemplate, path.join(this._.capitalizeFile(this.name)));
|
||||||
};
|
};
|
||||||
+20
-9
@@ -2,24 +2,35 @@
|
|||||||
var util = require('util');
|
var util = require('util');
|
||||||
var ScriptBase = require('../script-base.js');
|
var ScriptBase = require('../script-base.js');
|
||||||
|
|
||||||
var ActionGenerator = module.exports = function ActionGenerator(args, options, config) {
|
var StoreGenerator = module.exports = function StoreGenerator(args, options, config) {
|
||||||
args[0] += 'Store';
|
args[0] += 'Store';
|
||||||
ScriptBase.apply(this, arguments);
|
ScriptBase.apply(this, arguments);
|
||||||
}
|
}
|
||||||
|
|
||||||
util.inherits(ActionGenerator, ScriptBase);
|
util.inherits(StoreGenerator, ScriptBase);
|
||||||
|
|
||||||
ActionGenerator.prototype.createActionFile = function createActionFile() {
|
StoreGenerator .prototype.createStoreFile = function createStoreFile() {
|
||||||
this.option('es6');
|
this.option('es6');
|
||||||
|
|
||||||
this.es6 = this.options.es6;
|
this.es6 = this.options.es6;
|
||||||
this.dispatcherName = this._.capitalizeFile(this.config.get('app-name')) + 'AppDispatcher';
|
|
||||||
|
var storeTemplate;
|
||||||
|
switch (this.architecture){
|
||||||
|
case 'flux':
|
||||||
|
storeTemplate = 'FluxStore';
|
||||||
|
this.dispatcherName = this._.capitalizeFile(this.config.get('app-name')) + 'AppDispatcher';
|
||||||
|
break;
|
||||||
|
case 'reflux':
|
||||||
|
storeTemplate = 'RefluxStore';
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
|
||||||
|
console.log('Creating ' + this.architecture + ' store');
|
||||||
|
|
||||||
|
|
||||||
this.generateSourceAndTest(
|
this.generateSourceAndTest(
|
||||||
'Store',
|
storeTemplate,
|
||||||
'spec/Store',
|
'spec/Store',
|
||||||
void(0),
|
'stores'
|
||||||
'stores',
|
|
||||||
false
|
|
||||||
);
|
);
|
||||||
}
|
};
|
||||||
@@ -10,10 +10,11 @@
|
|||||||
"mainInput": "<% if (reactRouter) { %>main<% } else { %><%= scriptAppName %><% } %>",
|
"mainInput": "<% if (reactRouter) { %>main<% } else { %><%= scriptAppName %><% } %>",
|
||||||
"mainOutput": "main",
|
"mainOutput": "main",
|
||||||
"dependencies": {<% if (reactRouter) { %>
|
"dependencies": {<% if (reactRouter) { %>
|
||||||
"react-router": "^0.11.6",<% } if (flux) { %>
|
"react-router": "^0.11.6",<% } if (architecture === 'flux') { %>
|
||||||
"flux": "^2.0.1",
|
"flux": "^2.0.1",
|
||||||
"events": "^1.0.2",
|
"events": "^1.0.2",
|
||||||
"object-assign": "^2.0.0", <% } %>
|
"object-assign": "^2.0.0", <% } if (architecture === 'reflux') {%>
|
||||||
|
"reflux": "^0.2.7", <% } %>
|
||||||
"react": "~0.12.2",
|
"react": "~0.12.2",
|
||||||
"normalize.css": "~3.0.3"
|
"normalize.css": "~3.0.3"
|
||||||
},
|
},
|
||||||
|
|||||||
@@ -30,10 +30,11 @@ module.exports = {
|
|||||||
resolve: {
|
resolve: {
|
||||||
extensions: ['', '.js'],
|
extensions: ['', '.js'],
|
||||||
alias: {
|
alias: {
|
||||||
'styles': '../../../src/styles',
|
'styles': __dirname + '/src/styles',
|
||||||
'components': '../../../src/scripts/components/'<% if(flux) { %>,
|
'mixins': __dirname + '/src/scripts/mixins',
|
||||||
'stores': '../../../src/scripts/stores/',
|
'components': __dirname + '/src/scripts/components/'<% if(architecture==='flux'||architecture=='reflux') { %>,
|
||||||
'actions': '../../../src/scripts/actions/'<% } %>
|
'stores': __dirname + '/src/scripts/stores/',
|
||||||
|
'actions': __dirname + '/src/scripts/actions/'<% } %>
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
module: {
|
module: {
|
||||||
|
|||||||
@@ -35,10 +35,11 @@ module.exports = {
|
|||||||
resolve: {
|
resolve: {
|
||||||
extensions: ['', '.js'],
|
extensions: ['', '.js'],
|
||||||
alias: {
|
alias: {
|
||||||
'styles': '../../../src/styles',
|
'styles': __dirname + '/src/styles',
|
||||||
'components': '../../../src/scripts/components/'<% if(flux) { %>,
|
'mixins': __dirname + '/src/scripts/mixins',
|
||||||
'stores': '../../../src/scripts/stores/',
|
'components': __dirname + '/src/scripts/components/'<% if(architecture==='flux'||architecture=='reflux') { %>,
|
||||||
'actions': '../../../src/scripts/actions/'<% } %>
|
'stores': __dirname + '/src/scripts/stores/',
|
||||||
|
'actions': __dirname + '/src/scripts/actions/'<% } %>
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|||||||
@@ -8,12 +8,12 @@ module.exports = function (config) {
|
|||||||
frameworks: ['jasmine'],
|
frameworks: ['jasmine'],
|
||||||
files: [
|
files: [
|
||||||
'test/helpers/**/*.js',
|
'test/helpers/**/*.js',
|
||||||
'test/spec/components/**/*.js'<% if(flux) { %>,
|
'test/spec/components/**/*.js'<% if(architecture === 'flux'||architecture === 'reflux') { %>,
|
||||||
'test/spec/stores/**/*.js',
|
'test/spec/stores/**/*.js',
|
||||||
'test/spec/actions/**/*.js'<% } %>
|
'test/spec/actions/**/*.js'<% } %>
|
||||||
],
|
],
|
||||||
preprocessors: {
|
preprocessors: {
|
||||||
'test/spec/components/**/*.js': ['webpack']<% if(flux) { %>,
|
'test/spec/components/**/*.js': ['webpack']<% if(architecture === 'flux'||architecture === 'reflux') { %>,
|
||||||
'test/spec/stores/**/*.js': ['webpack'],
|
'test/spec/stores/**/*.js': ['webpack'],
|
||||||
'test/spec/actions/**/*.js': ['webpack']<% } %>
|
'test/spec/actions/**/*.js': ['webpack']<% } %>
|
||||||
},
|
},
|
||||||
@@ -52,7 +52,7 @@ module.exports = function (config) {
|
|||||||
resolve: {
|
resolve: {
|
||||||
alias: {
|
alias: {
|
||||||
'styles': path.join(process.cwd(), './src/styles/'),
|
'styles': path.join(process.cwd(), './src/styles/'),
|
||||||
'components': path.join(process.cwd(), './src/scripts/components/')<% if(flux) { %>,
|
'components': path.join(process.cwd(), './src/scripts/components/')<% if(architecture === 'flux'||architecture === 'reflux') { %>,
|
||||||
'stores': '../../../src/scripts/stores/',
|
'stores': '../../../src/scripts/stores/',
|
||||||
'actions': '../../../src/scripts/actions/'<% } %>
|
'actions': '../../../src/scripts/actions/'<% } %>
|
||||||
}
|
}
|
||||||
|
|||||||
File renamed without changes.
File renamed without changes.
@@ -0,0 +1,11 @@
|
|||||||
|
'use strict';
|
||||||
|
|
||||||
|
var Reflux = require('reflux');
|
||||||
|
|
||||||
|
var <%= classedName %> = Reflux.createActions([
|
||||||
|
|
||||||
|
]);
|
||||||
|
|
||||||
|
|
||||||
|
<% if (es6) { %> export default <%= classedName %>; <% }
|
||||||
|
else { %>module.exports = <%= classedName %>; <% } %>
|
||||||
@@ -0,0 +1,14 @@
|
|||||||
|
'use strict';
|
||||||
|
|
||||||
|
var Reflux = require('reflux');
|
||||||
|
//var Actions = require('actions/..');
|
||||||
|
|
||||||
|
|
||||||
|
var <%= classedName %> = Reflux.createStore({
|
||||||
|
listenables: Actions,
|
||||||
|
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
<% if (es6) { %> export default <%= classedName %>; <% }
|
||||||
|
else { %>module.exports = <%= classedName %>; <% } %>
|
||||||
Reference in new issue
Block a user