ECN>> butter-component-builder>> 返回
项目作者： buttercomponents

项目描述 ：
A base class for building butter components
高级语言： JavaScript
项目地址: git://github.com/buttercomponents/butter-component-builder.git
创建时间： 2016-01-22T16:29:44Z
项目社区：https://github.com/buttercomponents/butter-component-builder
开源协议：MIT License
下载


butter-component-builder

The minimal dev environment to enable live-editing Butter React components.

Usage

in your component root tree:

  1. npm install butter-component-builder

add this to your package.json:

  1.   "scripts": {
  2.     "build": "webpack --config node_modules/butter-component-builder/webpack.build.js --progress --profile --colors",
  3.     "start": "node node_modules/butter-component-builder/server.js",
  4.     "lint": "eslint src"
  5.   },

then run:

  1. npm start
  2. open http://localhost:3000

WARNING currently you need to manually install
babel-plugin-react-transform and react-transform-hmr to use the
live-reloader… i don’t really understand why that is, if you have any idea
please PR !

your component entry point is src/index.js.
you can put a json file in test/data.json, and your component will be
mounted with the test data as props.

Your changes will appear without reloading the browser like in this video.

Linting

This boilerplate project includes React-friendly ESLint configuration.

  1. npm run lint

Using 0.0.0.0 as Host

You may want to change the host in server.js and webpack.config.js from localhost to 0.0.0.0 to allow access from same WiFi network. This is not enabled by default because it is reported to cause problems on Windows. This may also be useful if you’re using a VM.

Missing Features

This boilerplate is purposefully simple to show the minimal configuration for React Hot Loader. For a real project, you’ll want to add a separate config for production with hot reloading disabled and minification enabled. You’ll also want to add a router, styles and maybe combine dev server with an existing server. This is out of scope of this boilerplate, but you may want to look into other starter kits.

Dependencies

Resources