From 062b057f51288e49ade797ca32c8bf370650129c Mon Sep 17 00:00:00 2001 From: "M.Y.Akashi" Date: Tue, 5 Sep 2017 12:59:56 +0800 Subject: [PATCH 1/4] =?UTF-8?q?=E6=A0=B9=E6=8D=AE=E4=B8=9A=E5=8A=A1?= =?UTF-8?q?=E6=A1=86=E6=9E=B6=E8=B0=83=E6=95=B4=E8=84=9A=E6=9C=AC=E6=BA=90?= =?UTF-8?q?=E7=A0=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- bin/react | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/bin/react b/bin/react index fbca588..ca9d115 100755 --- a/bin/react +++ b/bin/react @@ -70,7 +70,7 @@ program name: name, props: props }); - fs.writeFile(path.join(process.cwd(), "src/components", name.toLowerCase()+".jsx"), component); + fs.writeFile(path.join(process.cwd(), "src/"+name.toLowerCase()+"/components", name.toLowerCase()+".jsx"), component); }); }); From fead52aad515e4da3a2b4e84c396ab18b7843178 Mon Sep 17 00:00:00 2001 From: "M.Y.Akashi" Date: Tue, 5 Sep 2017 13:01:27 +0800 Subject: [PATCH 2/4] =?UTF-8?q?=E8=A1=A5=E5=85=85=E8=B7=AF=E5=BE=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- bin/react | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/bin/react b/bin/react index ca9d115..a1a7a85 100755 --- a/bin/react +++ b/bin/react @@ -70,7 +70,7 @@ program name: name, props: props }); - fs.writeFile(path.join(process.cwd(), "src/"+name.toLowerCase()+"/components", name.toLowerCase()+".jsx"), component); + fs.writeFile(path.join(process.cwd(), "src/routes/"+name.toLowerCase()+"/components", name.toLowerCase()+".jsx"), component); }); }); From ffb20862a3c4c441e61fd8b812ac2fb8c0ed9db2 Mon Sep 17 00:00:00 2001 From: "M.Y.Akashi" Date: Wed, 6 Sep 2017 16:09:46 +0800 Subject: [PATCH 3/4] =?UTF-8?q?=E8=87=AA=E7=94=B1=E5=8C=96=E8=84=9A?= =?UTF-8?q?=E6=9C=AC=E5=B7=A5=E5=85=B7?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- bin/react | 42 +++++++++++++++++++++++++++++++++++++++++- 1 file changed, 41 insertions(+), 1 deletion(-) diff --git a/bin/react b/bin/react index a1a7a85..08f7b0c 100755 --- a/bin/react +++ b/bin/react @@ -9,6 +9,35 @@ var fs = require('fs-extra'); var path = require('path'); var ejs = require('ejs'); +/** + * @methd mkdir + * @desc 递归生成文件目录 + */ +// 使用时第二个参数可以忽略 +function mkdir(dirpath, dirname) { + //判断是否是第一次调用 + if (typeof dirname === 'undefined') { + if (fs.existsSync(dirpath)) { + + } else { + mkdir(dirpath, path.dirname(dirpath)) + } + } else { + //判断第二个参数是否正常，避免调用时传入错误参数 + if (dirname !== path.dirname(dirpath)) { + mkdir(dirpath) + return + } + if (fs.existsSync(dirname)) { + fs.mkdirSync(dirpath) + } else { + mkdir(dirname, path.dirname(dirname)) + fs.mkdirSync(dirpath) + } + } +} + + // Parse command line options program @@ -70,7 +99,18 @@ program name: name, props: props }); - fs.writeFile(path.join(process.cwd(), "src/routes/"+name.toLowerCase()+"/components", name.toLowerCase()+".jsx"), component); + /** + * 创建模版文件？ + * fs.writeFile(path.join(process.cwd(), <文件路径>, <文件名称>), <模版文件>); + * 样板代码： + * fs.writeFile(path.join(process.cwd(), "src/components", name+".jsx"), component); + * 这样会在src/components目录下按照component模版生成指定名称的jsx文件 + * + * 如何生成指定路径内缺少的文件夹？ + * 调用自定义mkdir方法 + * 样板代码： + * mkdir('src/', 'components') + */ }); }); From c5cb9f748561977ecec54f1ff5643d3329adfd4e Mon Sep 17 00:00:00 2001 From: "M.Y.Akashi" Date: Sun, 29 Oct 2017 21:55:20 -0500 Subject: [PATCH 4/4] Update react --- bin/react | 191 +++++++++++++++++++++++++++++------------------------- 1 file changed, 103 insertions(+), 88 deletions(-) diff --git a/bin/react b/bin/react index 08f7b0c..9e5c45f 100755 --- a/bin/react +++ b/bin/react @@ -1,29 +1,26 @@ -#!/usr/bin/env node -'use strict'; - -process.bin = process.title = 'react'; - -var program = require('commander'); -var pkg = require('../package.json'); -var fs = require('fs-extra'); -var path = require('path'); -var ejs = require('ejs'); +#!/usr/bin/env node +'use strict' +process.bin = process.title = 'react' +var program = require('commander') +var pkg = require('../package.json') +var fs = require('fs-extra') +var path = require('path') +var ejs = require('ejs') /** * @methd mkdir * @desc 递归生成文件目录 */ // 使用时第二个参数可以忽略 -function mkdir(dirpath, dirname) { - //判断是否是第一次调用 +function mkdir (dirpath, dirname) { + // 判断是否是第一次调用 if (typeof dirname === 'undefined') { if (fs.existsSync(dirpath)) { - } else { mkdir(dirpath, path.dirname(dirpath)) } } else { - //判断第二个参数是否正常，避免调用时传入错误参数 + // 判断第二个参数是否正常，避免调用时传入错误参数 if (dirname !== path.dirname(dirpath)) { mkdir(dirpath) return @@ -36,92 +33,110 @@ function mkdir(dirpath, dirname) { } } } - - // Parse command line options - +program.version(pkg.version).usage(' [options]') program - .version(pkg.version) - .usage(" [options]"); - -program - .command("new ") - .description("Generate a new react app boilerplate.") - .action(function(name, options) { - - var templatePath = path.join(__dirname, '../template'); - var destinationPath = path.join(process.cwd(), name); - - console.log("Creating " + name + "..."); - + .command('new ') + .description('Generate a new react app boilerplate.') + .action(function (name, options) { + var templatePath = path.join(__dirname, '../template') + var destinationPath = path.join(process.cwd(), name) + console.log('Creating ' + name + '...') fs.copy(templatePath, destinationPath, function (err) { - if (err){ - return console.error(err); + if (err) { + return console.error(err) } - console.log('Success!'); - }); - - }); - + console.log('Success!') + }) + }) program - .command("generate [propName:PropType...]") - .option("-l, --skip-lifecycle", "Skip lifecycle method generation") - .description("Generate a new react component.") - .action(function(name, propDefs) { - var props = []; + .command('generate [propName:PropType...]') + .option('-l, --skip-lifecycle', 'Skip lifecycle method generation') + .description('Generate a new react component.') + .action(function (name, propDefs) { + var props = [] var possibleTypes = { - "any": "React.PropTypes.any", - "requiredAny": "React.PropTypes.any.isRequired", - "func": "React.PropTypes.func", - "requiredFunc": "React.PropTypes.func.isRequired", - "array": "React.PropTypes.array", - "requiredArray": "React.PropTypes.array.isRequired", - "bool": "React.PropTypes.bool", - "requiredBool": "React.PropTypes.bool.isRequired", - "number": "React.PropTypes.number", - "requiredNumber": "React.PropTypes.number.isRequired", - "object": "React.PropTypes.object", - "requiredObject": "React.PropTypes.object.isRequired", - "string": "React.PropTypes.string", - "requiredString": "React.PropTypes.string.isRequired", - }; - propDefs.forEach(function(propDef) { - var nameType = propDef.split(":"); + any: 'React.PropTypes.any', + requiredAny: 'React.PropTypes.any.isRequired', + func: 'React.PropTypes.func', + requiredFunc: 'React.PropTypes.func.isRequired', + array: 'React.PropTypes.array', + requiredArray: 'React.PropTypes.array.isRequired', + bool: 'React.PropTypes.bool', + requiredBool: 'React.PropTypes.bool.isRequired', + number: 'React.PropTypes.number', + requiredNumber: 'React.PropTypes.number.isRequired', + object: 'React.PropTypes.object', + requiredObject: 'React.PropTypes.object.isRequired', + string: 'React.PropTypes.string', + requiredString: 'React.PropTypes.string.isRequired', + } + propDefs.forEach(function (propDef) { + var nameType = propDef.split(':') props.push({ name: nameType[0], - type: possibleTypes[nameType[1]] - }); - }); - var lifecycle = !this.skipLifecycle; - fs.readFile(path.join(__dirname, "../templates", "component.ejs"), 'utf8', function (err, data) { + type: possibleTypes[nameType[1]], + }) + }) + var lifecycle = !this.skipLifecycle + /** + * 创建模版文件？ + * fs.writeFile(path.join(process.cwd(), <文件路径>, <文件名称>), <模版文件>); + * 样板代码： + * fs.writeFile(path.join(process.cwd(), "src/components", name+".jsx"), component); + * 这样会在src/components目录下按照component模版生成指定名称的jsx文件 + * + * 如何生成指定路径内缺少的文件夹？ + * 调用自定义mkdir方法 + * 样板代码： + * mkdir('src/', 'components') + */ + fs.readFile(path.join(__dirname, '../templates', 'component.ejs'), 'utf8', function (err, data) { var component = ejs.render(data, { lifecycle: lifecycle, name: name, - props: props - }); - /** - * 创建模版文件？ - * fs.writeFile(path.join(process.cwd(), <文件路径>, <文件名称>), <模版文件>); - * 样板代码： - * fs.writeFile(path.join(process.cwd(), "src/components", name+".jsx"), component); - * 这样会在src/components目录下按照component模版生成指定名称的jsx文件 - * - * 如何生成指定路径内缺少的文件夹？ - * 调用自定义mkdir方法 - * 样板代码： - * mkdir('src/', 'components') - */ - }); - }); - + props: props, + }) + const filePath = 'src/routes/' + name + '/components' + mkdir(filePath) + fs.writeFile(path.join(process.cwd(), filePath, name + '.jsx'), component) + }) + fs.readFile(path.join(__dirname, '../templates', 'container.ejs'), 'utf8', function (err, data) { + var component = ejs.render(data, { + lifecycle: lifecycle, + name: name, + props: props, + }) + const filePath = 'src/routes/' + name + '/containers' + mkdir(filePath) + fs.writeFile(path.join(process.cwd(), filePath, name + 'Container.js'), component) + }) + fs.readFile(path.join(__dirname, '../templates', 'reducer.ejs'), 'utf8', function (err, data) { + var component = ejs.render(data, { + lifecycle: lifecycle, + name: name, + props: props, + }) + const filePath = 'src/routes/' + name + '/modules' + mkdir(filePath) + fs.writeFile(path.join(process.cwd(), filePath, name.toLowerCase() + '.js'), component) + }) + fs.readFile(path.join(__dirname, '../templates', 'index.ejs'), 'utf8', function (err, data) { + var component = ejs.render(data, { + lifecycle: lifecycle, + name: name, + props: props, + }) + const filePath = 'src/routes/' + name + fs.writeFile(path.join(process.cwd(), filePath, 'index.js'), component) + }) + }) // Failsafe that shows the help dialogue if the command is not recognized (`$ react xyz`) -program.on('*', function(opt) { - program.help(); -}); - -program.parse(process.argv); - +program.on('*', function (opt) { + program.help() +}) +program.parse(process.argv) // Handle case where no command is passed (`$ react`) if (!process.argv.slice(2).length) { - program.help(); + program.help() }