diff --git a/app/index.js b/app/index.js index 55136f7..455071b 100644 --- a/app/index.js +++ b/app/index.js @@ -32,7 +32,10 @@ var ReactWebpackGenerator = module.exports = function ReactWebpackGenerator(args this.installDependencies({ skipInstall: options['skip-install'] }); }); + this.pkg = JSON.parse(this.readFileAsString(path.join(__dirname, '../package.json'))); + + this.config.save(); }; util.inherits(ReactWebpackGenerator, yeoman.generators.Base); @@ -60,6 +63,25 @@ ReactWebpackGenerator.prototype.askForReactRouter = function () { }.bind(this)); }; +ReactWebpackGenerator.prototype.askForStylesLanguage = function () { + var done = this.async(); + this.prompt({ + type : 'list', + name : 'stylesLanguage', + message : 'Which styles language you want to use?', + choices: [ + {name: 'CSS', value: 'css'}, + {name: 'SASS', value: 'sass'}, + {name: 'LESS', value: 'less'}, + {name: 'Stylus', value: 'stylus'} + ], + default : 'css' + }, function (props) { + this.config.set('styles-language', props.stylesLanguage); + done(); + }.bind(this)); +}; + ReactWebpackGenerator.prototype.readIndex = function readIndex() { this.indexFile = this.engine(this.read('../../templates/common/index.html'), this); }; diff --git a/script-base.js b/script-base.js index 6ee2e39..1964fc4 100644 --- a/script-base.js +++ b/script-base.js @@ -38,6 +38,18 @@ var Generator = module.exports = function Generator() { this.stylesSuffix = '.css'; + switch(this.config.get('styles-language')) { + case 'sass': + this.stylesSuffix = '.sass'; + break; + case 'less': + this.stylesSuffix = '.less'; + break; + case 'stylus': + this.stylesSuffix = '.styl'; + break; + } + this.sourceRoot(path.join(__dirname, sourceRoot)); }; diff --git a/templates/styles/Component.less b/templates/styles/Component.less new file mode 100644 index 0000000..2bb362b --- /dev/null +++ b/templates/styles/Component.less @@ -0,0 +1,3 @@ +.<%= classedName %>{ + border: 1px dashed #f00; +} \ No newline at end of file diff --git a/templates/styles/Component.sass b/templates/styles/Component.sass new file mode 100644 index 0000000..9811abb --- /dev/null +++ b/templates/styles/Component.sass @@ -0,0 +1,2 @@ +.<%= classedName %> + border: 1px dashed #f00 diff --git a/templates/styles/Component.styl b/templates/styles/Component.styl new file mode 100644 index 0000000..4cc329f --- /dev/null +++ b/templates/styles/Component.styl @@ -0,0 +1,2 @@ +.<%= classedName %> + border 1px dashed #f00 diff --git a/test/test-creation.js b/test/test-creation.js index b006aa5..dbbfa44 100644 --- a/test/test-creation.js +++ b/test/test-creation.js @@ -48,6 +48,7 @@ describe('react-webpack generator', function() { it('should generate dotfiles', function(done) { react.run({}, function() { helpers.assertFile([].concat(expected, [ + '.yo-rc.json', '.editorconfig', '.gitignore', '.jshintrc' @@ -110,6 +111,46 @@ describe('react-webpack generator', function() { }); + describe('Generator', function () { + + it('should contain info about used style lang', function (done) { + react.run({}, function() { + assert.ok(react.config.get('styles-language')); + done(); + }); + }); + + it('by default should use css style lang', function (done) { + react.run({}, function() { + assert.equal(react.config.get('styles-language'), 'css'); + done(); + }); + }); + + var assertStyle = function (lang, done) { + helpers.mockPrompt(react, { + stylesLanguage: lang + }); + react.run({}, function() { + assert.equal(react.config.get('styles-language'), lang); + done(); + }); + }; + + it('should use sass style lang', function (done) { + assertStyle('sass', done); + }); + + it('should use less style lang', function (done) { + assertStyle('less', done); + }); + + it('should use stylus style lang', function (done) { + assertStyle('stylus', done); + }); + + }); + describe('Subgenerators', function() { var generatorTest = function(generatorType, specType, targetDirectory, scriptNameFn, specNameFn, suffix, done) {