Giter Club home page Giter Club logo

rocketact's Introduction

rocketact

🚀 Developing React projects with ease

Build Status David (path) node

npm Downloads issues open issues closed GitHub contributors PRs Welcome

Features

  • ⚡️ Zero configuration
  • 👏 Supports both Single-Page Application and Multi-Page Application
  • 📤 Supports TypeScript、Sass、PostCSS out of box
  • 🖥 Full-featured web console
  • 🕹 Fully control over every step of the build process
  • 🔌 Supports Yarn Plug'n'Play environment
  • 💈 Supports Custom Template

Usage

With npx, run:

npx rocketact create my-awesome-project

Or you can install rocketact globaly:

npm install -g rocketact
rocketact create my-awesome-project
cd my-awesome-project

More info please refer to Rocketact website.

Available Scripts

Start

Start local development environment

yarn start
# or
npm start

Build

Perform a production build

yarn build
# or
npm run build

Packages

Name Description Meta
rocketact commandline tool to create new projects David (path)
rocketact-scripts main functionality resides here David (path)
rocketact-dev-utils common utils shared by other packages David (path)
rocketact-web-console web console core David (path)
babel-preset-rocketact babel presets for Rocketact projects David (path)
rocketact-plugin-polyfill automatically setup polyfill configuration David (path)
rocketact-plugin-bundle-analyzer add webpack-bundle-analyzer intergation for Rocketact projects David (path)
rocketact-plugin-legacy-decorators add legacy decorators support for Rocketact projects David (path)
rocketact-plugin-butler add compatibility for legacy Butler projects David (path)

Awesome Plugins

Name Description
rocketact-plugin-yep-react support yep-react ui components lib
rocketact-plugin-icons-react support @jdcfe/icons-react use svg
rocketact-plugin-bundle-with-banner bundle with banner
rocketact-plugin-bundle-with-version bundle with version which in package.json
rocketact-plugin-jdc-practices jdc fe team practices

Thanks for contributing these awesome plugins, you can find more plugins from npm query link.

Contributing

Please read our contributing guide.

rocketact's People

Contributors

beanlee avatar dependabot[bot] avatar loveky avatar

Stargazers

avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar

Watchers

avatar avatar avatar avatar

Forkers

loveky beanlee thoughtbit hanyuxinting onlyfor3ver linrufeng dahui4dev dushoujun daisy-li gxuebin zy19940510

rocketact's Issues

[Bug] [email protected] start & build error

Describe the bug

 $ yarn start
yarn run v1.13.0
$ rocketact-scripts start
internal/modules/cjs/loader.js:582
    throw err;
    ^

Error: Cannot find module 'autoprefixer'
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:580:15)
    at Function.Module._load (internal/modules/cjs/loader.js:506:25)
    at Module.require (internal/modules/cjs/loader.js:636:17)
    at require (internal/modules/cjs/helpers.js:20:18)
    at Object.<anonymous> (/Users/xxx/work/code/pc/xxx/node_modules/rocketact-scripts/dist/config/webpack/module.js:3:22)
    at Module._compile (internal/modules/cjs/loader.js:688:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:699:10)
    at Module.load (internal/modules/cjs/loader.js:598:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:537:12)
    at Function.Module._load (internal/modules/cjs/loader.js:529:3)
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

Environment (please complete the following information):

[Feature Request] ESLint 相关升级

🌈 Feature

Is your feature request related to a problem? Please describe.

  • 项目模板升级，tslint 升级为统一 eslint + plugin:@typescript-eslint/recommended
  • 将 build 中 lint 功能做成可配置开关形式，将 lint 命令放在可执行脚本中，由使用者独立执行，比如增加 --fix 一类的配置

Describe the solution you'd like
A clear and concise description of what you want to happen.

Describe alternatives you've considered
A clear and concise description of any alternative solutions or features you've considered.

Additional context
Add any other context or screenshots about the feature request here.

[Feature Request] 开发环境中更好的处理文件删除

🌈 Feature

Is your feature request related to a problem? Please describe.
A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

Describe the solution you'd like
A clear and concise description of what you want to happen.

Describe alternatives you've considered
A clear and concise description of any alternative solutions or features you've considered.

Additional context
Add any other context or screenshots about the feature request here.

[Bug] 完善单元测试，解决CI单元测试错误

🐛 bug report

Describe the bug
A clear and concise description of what the bug is.

To Reproduce
Steps to reproduce the behavior:
1.
2.
3.
4.

Expected behavior
A clear and concise description of what you expected to happen.

Screenshots
If applicable, add screenshots to help explain your problem.

Environment (please complete the following information):

  • OS:
  • Node Version:
  • Version:

[Feature Request] Better console output when en counting errors

🌈 Feature

Is your feature request related to a problem? Please describe.
A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

Describe the solution you'd like
A clear and concise description of what you want to happen.

Describe alternatives you've considered
A clear and concise description of any alternative solutions or features you've considered.

Additional context
Add any other context or screenshots about the feature request here.

[Feature Request] 支持配置指定node_modules下的目录参与编译流程

🌈 Feature

Is your feature request related to a problem? Please describe.
A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

Describe the solution you'd like
A clear and concise description of what you want to happen.

Describe alternatives you've considered
A clear and concise description of any alternative solutions or features you've considered.

Additional context
Add any other context or screenshots about the feature request here.

[Feature Request] add Mock panel in web console

在 web console 中增加 Mock 功能（名称待定）

主要支持以下场景：

  • 支持将特定url映射到本地json文件
  • 支持按照规则将接口转发到远程服务器
  • 支持对接成熟的第三方服务，比如 swagger

其它功能：

  • 实时保存配置信息到项目目录，方便多人共享
  • 允许用户在web console 中对规则排序
  • 允许用户在web console 开启或停用某条规则

cc @beanlee 看看还有什么场景或注意事项

[Feature Request] build 增加 --with-version

🌈 Feature

支持将 version 放在构建在引用路径内，以适应不用 hash 只使用 version 来控制构建产物的场景

理论上 --no-hash 配置平行，互相无影响

[Feature Request] 支持自定义初始化模板

🌈 Feature

Is your feature request related to a problem? Please describe.
A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

Describe the solution you'd like
A clear and concise description of what you want to happen.

Describe alternatives you've considered
A clear and concise description of any alternative solutions or features you've considered.

Additional context
Add any other context or screenshots about the feature request here.

[Bug] Build 过程如果项目中无 tslint 配置，没有必要启动 tschecker

🐛 bug report

Describe the bug

rocketact/packages/rocketact-scripts/src/config/webpack/plugins.ts

Lines 98 to 121 in b92194c

const enableTSLintCheck =
checkPackageInstalled("tslint") &&
fs.existsSync(resolveToAppRoot("tslint.json"));
const enableTSCheck =
checkPackageInstalled("typescript") &&
fs.existsSync(resolveToAppRoot("tsconfig.json"));
if (enableTSCheck) {
webpackChain
.plugin("ForkTsCheckerWebpackPlugin")
.use(ForkTsCheckerWebpackPlugin, [
{
tsconfig: resolveToAppRoot("tsconfig.json"),
tslint: enableTSLintCheck
? resolveToAppRoot("tslint.json")
: undefined,
async: false,
typescript: require.resolve("typescript", { paths: [appRoot()] }),
silent: true
}
]);
}
}

Expected behavior
A clear and concise description of what you expected to happen.

rocketact/packages/rocketact-scripts/src/config/webpack/plugins.ts

Line 106 in b92194c

if (enableTSCheck) { 

- if (enableTSCheck ) {

+ if (enableTSLintCheck && enableTSCheck ) {

[Bug] Cannot proxy POST request

Describe the bug
A clear and concise description of what the bug is.

To Reproduce
Steps to reproduce the behavior:
1.
2.
3.
4.

Expected behavior
A clear and concise description of what you expected to happen.

Screenshots
If applicable, add screenshots to help explain your problem.

Environment (please complete the following information):

  • OS:
  • Node Version:
  • Version:

[Bug] 优化依赖安装弹框

Describe the bug
A clear and concise description of what the bug is.

To Reproduce
Steps to reproduce the behavior:
1.
2.
3.
4.

Expected behavior
A clear and concise description of what you expected to happen.

Screenshots
If applicable, add screenshots to help explain your problem.

Environment (please complete the following information):

  • OS:
  • Node Version:
  • Version:

[讨论] ProxyConfig 当时为什么在保存时去除了 enable ？以及设置 enable 时为什么没有同步保存到本地？

疑问？

有一个需求，当项目配置 n 个接口代理，亟需一个一键生效所有代理的功能，否则每次启动以后都要手动一个一个点开，但其实看代码 API 内部在写入文件的时候只是过滤掉了这个属性，原本是保存某一个或某一些接口代理状态的功能。

当时为什么在保存时去除了 enabled ？

保存时过滤掉 enabled 属性，保证用户每次启动项目都默认不开启，以免造成困扰吗？

针对这个问题有两个想法：

  • 同步保存 enabled 属性
  • 保存时过滤逻辑保留，提供 enable all 和 disable all 两个按钮

rocketact/packages/rocketact-web-console/src/server/proxyAPI.ts

Lines 37 to 49 in 1c70398

const syncToDisk = () => {
fs.writeFileSync(
CONFIG_FILE,
JSON.stringify(
ruleCache,
(key, value) => {
return key === "enabled" ? undefined : value;
},
" "
),
"utf-8"
);
};

这部分代码，设置 enable 时为什么没有同步保存到本地？

rocketact/packages/rocketact-web-console/src/server/proxyAPI.ts

Lines 99 to 111 in 1c70398

proxyAPI.put("/rule/:ruleId/enabled", (req, res) => {
ruleCache = ruleCache.map(rule => {
if (rule.ruleId === req.params.ruleId) {
return Object.assign({}, rule, { enabled: req.body.enabled });
} else {
return rule;
}
});
res.json({
success: true
});
});

[讨论] 优化插件系统

现有插件系统对用户不足够友好，遇到需要手动编写的情况，用户基本无法独立完成。

另外，插件这个名字本身也比较容易造成困扰。

[Feature Request] allow user choose port in development environment

Is your feature request related to a problem? Please describe.
A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

Describe the solution you'd like
A clear and concise description of what you want to happen.

Describe alternatives you've considered
A clear and concise description of any alternative solutions or features you've considered.

Additional context
Add any other context or screenshots about the feature request here.

cc @beanlee

[Feature Request] 支持 yarn --pnp

Is your feature request related to a problem? Please describe.
当前项目使用 yarn --pnp 安装依赖时，无法支持 rocketact-plugin-xxx

Describe the solution you'd like
调整扫描插件的实现，支持 pnp

Describe alternatives you've considered
获取可以通过你今天分享提到 pnp 的API来获取插件的实际地址来 require

packages/rocketact-scripts

resolveInstalledPlugins() {
    const installedPlugins = Object.keys(this.pkg.dependencies || {})
      .filter(isPlugin)
      .concat(Object.keys(this.pkg.devDependencies || {}).filter(isPlugin));
    installedPlugins.forEach(plugin =>
      require(resolveToAppRoot(`./node_modules/${plugin}`))(new CoreAPI(this))
    );
  }

[Bug] heap out of memory in node 10.x when webpack's devtool configed `cheap-module-source-map`

🐛 bug report

Describe the bug
devtool 编译生成 cheap-module-source-map 在 node 10 环境下内存溢出

[27849:0x102880000]   133250 ms: Mark-sweep 1377.8 (1409.0) -> 1377.8 (1409.5) MB, 366.7 / 0.0 ms  (average mu = 0.076, current mu = 0.015) allocation failure scavenge might not succeed


<--- JS stacktrace --->

==== JS stack trace =========================================

Security context: 0x1673f099e6c1 <JSObject>
    0: builtin exit frame: stringify(this=0x1673f09919f9 <Object map = 0x1673955842a9>,0x1673fa7826f1 <undefined>,0x1673fa7826f1 <undefined>,0x1673500ffcc9 <Object map = 0x167345daabb1>,0x1673f09919f9 <Object map = 0x1673955842a9>)

    1: arguments adaptor frame: 1->3
    2: /* anonymous */(aka /* anonymous */) [0x1673e6f2d6a1] [/Users/xxx/node_modules/webpack/lib/Sourc...

FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory

Environment (please complete the following information):

  • Node Version: v10

[Feature Request] 依赖展示页加载顺序优化

🌈 Feature

Is your feature request related to a problem? Please describe.

现状：控制台-依赖展示中 store 会在初始化默认循环拉去依赖信息，当用户切换到依赖页面时可以方便查看依赖信息。

问题：如果依赖过多会阻塞后面请求，比如用户访问控制台直接查看 proxy 页面，会因为拉去依赖到循环依赖过多，导致阻塞了请求本地 proxy.config.json 的请求

Snipaste_2020-04-30_10-31-08

Describe the solution you'd like

调整 dependencie store 的初始化顺序，改为切换页面时调用 refresh 刷新，同时增加缓存校验，如果 store 已经加载过就不再触发 refresh，页面内手动触发 refresh 逻辑不变。

手动触发 refresh 逻辑如下：

  • 新增、删除依赖
  • 点击 refresh 按钮

Describe alternatives you've considered

nope

Additional context

nope

[Bug] multi-page app start error

Describe the bug

butler 升级项目，更新 rocketact-scripts@1.3.x 启动报错，疑似多页面引起，明天来了验证下

Expected behavior

yarn run v1.13.0
$ rocketact-scripts start
 WAITING  Building...
/Users/lilong3/work/code/m/JDC_mall_fzc/node_modules/interpolate-html-plugin/index.js:35
      compilation.hooks.htmlWebpackPluginBeforeHtmlProcessing.tap(
                                                              ^

TypeError: Cannot read property 'tap' of undefined
    at compiler.hooks.compilation.tap.compilation (/Users/lilong3/work/code/m/JDC_mall_fzc/node_modules/interpolate-html-plugin/index.js:35:63)
    at SyncHook.eval [as call] (eval at create (/Users/lilong3/work/code/m/JDC_mall_fzc/node_modules/tapable/lib/HookCodeFactory.js:19:10), <anonymous>:15:1)
    at SyncHook.lazyCompileHook (/Users/lilong3/work/code/m/JDC_mall_fzc/node_modules/tapable/lib/Hook.js:154:20)
    at Compiler.newCompilation (/Users/lilong3/work/code/m/JDC_mall_fzc/node_modules/webpack/lib/Compiler.js:581:26)
    at hooks.beforeCompile.callAsync.err (/Users/lilong3/work/code/m/JDC_mall_fzc/node_modules/webpack/lib/Compiler.js:617:29)
    at AsyncSeriesHook.eval [as callAsync] (eval at create (/Users/lilong3/work/code/m/JDC_mall_fzc/node_modules/tapable/lib/HookCodeFactory.js:32:10), <anonymous>:6:1)
    at AsyncSeriesHook.lazyCompileHook (/Users/lilong3/work/code/m/JDC_mall_fzc/node_modules/tapable/lib/Hook.js:154:20)
    at Compiler.compile (/Users/lilong3/work/code/m/JDC_mall_fzc/node_modules/webpack/lib/Compiler.js:612:28)
    at compiler.hooks.watchRun.callAsync.err (/Users/lilong3/work/code/m/JDC_mall_fzc/node_modules/webpack/lib/Watching.js:76:18)
    at AsyncSeriesHook.eval [as callAsync] (eval at create (/Users/lilong3/work/code/m/JDC_mall_fzc/node_modules/tapable/lib/HookCodeFactory.js:32:10), <anonymous>:24:1)
    at AsyncSeriesHook.lazyCompileHook (/Users/lilong3/work/code/m/JDC_mall_fzc/node_modules/tapable/lib/Hook.js:154:20)
    at Watching._go (/Users/lilong3/work/code/m/JDC_mall_fzc/node_modules/webpack/lib/Watching.js:40:32)
    at Watching.compiler.readRecords.err (/Users/lilong3/work/code/m/JDC_mall_fzc/node_modules/webpack/lib/Watching.js:32:9)
    at Compiler.readRecords (/Users/lilong3/work/code/m/JDC_mall_fzc/node_modules/webpack/lib/Compiler.js:479:11)
    at new Watching (/Users/lilong3/work/code/m/JDC_mall_fzc/node_modules/webpack/lib/Watching.js:29:17)
    at Compiler.watch (/Users/lilong3/work/code/m/JDC_mall_fzc/node_modules/webpack/lib/Compiler.js:207:10)
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
FAIL

[Feature Request] add test support

🌈 Feature

Is your feature request related to a problem? Please describe.

支持编写测试代码

Describe the solution you'd like

  • rocketact创建的模板项目自带测试套件
  • 更新文档站

[Feature Request] build时支持通过参数指定构建出的文件名中不包含hash

Is your feature request related to a problem? Please describe.
A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

Describe the solution you'd like
A clear and concise description of what you want to happen.

Describe alternatives you've considered
A clear and concise description of any alternative solutions or features you've considered.

Additional context
Add any other context or screenshots about the feature request here.

[Feature Request] 多页面入口支持 `pages` 下更沉一层文件夹

🌈 Feature

多页面入口配置，支持 pages 目录下，更沉一层文件夹。

.
└── src
    ├── pageA
    │   ├── pageA.html
    │   └── pageA.tsx
    └── pageB
        ├── pageB.html
        └── pageB.tsx

现有代码只支持多页面在同一层

rocketact/packages/rocketact-dev-utils/src/getValidEntries.ts

Lines 16 to 28 in 7389819

const fullPath = path.resolve(p, "./src/pages");
if (fs.existsSync(fullPath)) {
const files = fs.readdirSync(fullPath);
const result: IEntries = {};
files.forEach(file => {
if (file.match(extReg)) {
result[path.basename(file).replace(extReg, "")] = path.resolve(
fullPath,
file
);
}
});

[Feature Request] 能支持decorator的老版本么

🌈 Feature

目前遇到了一个问题，在使用Mobx时，不支持修饰符，提示：

Support for the experimental syntax 'decorators-legacy' isn't currently enabled

修改 tsconfig.json 的 experimentalDecorators 选项，也没有搞定。

经了解，rocketact 是通过babel编译的，目前使用的是decorator的新版本，能否实现老版本呢？

非常感谢~

[Bug] API Proxy 功能：上游接口异常不应导致开发环境自身异常退出

Describe the bug
A clear and concise description of what the bug is.

To Reproduce
Steps to reproduce the behavior:
1.
2.
3.
4.

Expected behavior
A clear and concise description of what you expected to happen.

Screenshots
If applicable, add screenshots to help explain your problem.

Environment (please complete the following information):

  • OS:
  • Node Version:
  • Version:

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.