From dff74f44def922b91072ad182b39bf3829e0932f Mon Sep 17 00:00:00 2001 From: David Baker Date: Fri, 3 Jul 2015 15:56:04 +0100 Subject: [PATCH] Tweak the example build process. Move example -> examples/trivial to we can have more than one. Update README appropriately. --- .npmignore | 3 ++ README.md | 37 ++++++++++------------ {example => examples/trivial}/README.md | 0 {example => examples/trivial}/index.html | 2 +- {example/lib => examples/trivial}/index.js | 0 {example => examples/trivial}/package.json | 11 ++++--- package.json | 6 ++-- 7 files changed, 32 insertions(+), 27 deletions(-) create mode 100644 .npmignore rename {example => examples/trivial}/README.md (100%) rename {example => examples/trivial}/index.html (79%) rename {example/lib => examples/trivial}/index.js (100%) rename {example => examples/trivial}/package.json (62%) diff --git a/.npmignore b/.npmignore new file mode 100644 index 0000000000..1ce5400d43 --- /dev/null +++ b/.npmignore @@ -0,0 +1,3 @@ +example +examples +build/.module-cache diff --git a/README.md b/README.md index 672783743e..734849b16e 100644 --- a/README.md +++ b/README.md @@ -3,34 +3,31 @@ matrix-react-sdk This is a react-based SDK for inserting a Matrix chat client into a web page -Getting started with the example -================================ +Getting started with the trivial example +======================================== 1. Install or update `node.js` so that your `npm` is at least at version `2.0.0` 2. Clone the repo: `git clone https://github.com/matrix-org/matrix-react-sdk.git` -3. Switch to your new checkout: `cd matrix-react-sdk` -4. Build the CSS: `npm install && npm run build:css` -5. Switch to the example: `cd example` -6. Build the javascript & copy the CSS: - `npm install && npm run build && ln -s ../bundle.css ./` +3. Switch to the example directory: `cd matrix-react-sdk/examples/trivial` +4. Install the prerequisites: `npm install` +5. Build the example and start a server: `npm start` -Serve the app from within the `example` directory by running `python -m -SimpleHTTPServer 8000` and access it at -[http://127.0.0.1:8000](http://127.0.0.1:8000/) +Now open http://127.0.0.1:8080/ in your browser to see your newly built +Matrix client. Using the example app for development ===================================== -To develop using the example app, you can avoid havign to repeat the above -steps each time you change something: +The above commands will let you start working on the app, and any changes you +make to the javascript source files will cause the javascript to be rebuilt +automatically, but the same will not apply for the CSS. -1. Perform all the steps above -2. In the matrix-react-sdk directory: `npm run start:css` -3. Open a new terminal window in the matrix-react-sdk directory: - `cd example; npm start` +To have the CSS bundle also rebuild as you change it: -Now, development version of your Javascript and CSS will be rebuilt whenever -you change any of the files (although you may need to restart the CSS builder -if you add a new file). Note that the debug CSS and Javascript are much, much -larger than the production versions. +1. `cd matrix-react-sdk` +2. `npm start:css` + +Note that you may need to restart the CSS builder if you add a new file. Note +that `npm start` builds debug versions of the the javascript and CSS, which are +much larger than the production versions build by the `npm run build` commands. diff --git a/example/README.md b/examples/trivial/README.md similarity index 100% rename from example/README.md rename to examples/trivial/README.md diff --git a/example/index.html b/examples/trivial/index.html similarity index 79% rename from example/index.html rename to examples/trivial/index.html index bdc7ce7e01..98703e2715 100644 --- a/example/index.html +++ b/examples/trivial/index.html @@ -7,6 +7,6 @@
- + diff --git a/example/lib/index.js b/examples/trivial/index.js similarity index 100% rename from example/lib/index.js rename to examples/trivial/index.js diff --git a/example/package.json b/examples/trivial/package.json similarity index 62% rename from example/package.json rename to examples/trivial/package.json index 4e2bc3adc7..02cca6bc16 100644 --- a/example/package.json +++ b/examples/trivial/package.json @@ -7,17 +7,20 @@ "type": "git", "url": "https://github.com/matrix-org/matrix-react-sdk" }, - "license": "Apache 2", + "license": "Apache-2.0", "devDependencies": { "browserify": "^10.2.3", "envify": "^3.4.0", - "matrix-react-sdk": "../", + "http-server": "^0.8.0", + "matrix-react-sdk": "../../", + "npm-css": "^0.2.3", + "parallelshell": "^1.2.0", "reactify": "^1.1.1", "uglify-js": "^2.4.23", "watchify": "^3.2.1" }, "scripts": { - "build": "browserify -t [ envify --NODE_ENV production ] -t reactify lib/index.js | uglifyjs -c -m -o bundle.js", - "start": "watchify -v -d -t reactify lib/index.js -o bundle.js" + "build": "browserify -t [ envify --NODE_ENV production ] -t reactify index.js | uglifyjs -c -m -o bundle.js", + "start": "parallelshell 'watchify -v -d -t reactify index.js -o bundle.js' 'http-server'" } } diff --git a/package.json b/package.json index 1d45dbab8c..ab6f8c41b6 100644 --- a/package.json +++ b/package.json @@ -7,15 +7,17 @@ "type": "git", "url": "https://github.com/matrix-org/matrix-react-sdk" }, - "license": "Apache 2", + "license": "Apache-2.0", "main": "src/index.js", + "style": "bundle.css", "scripts": { "build:js": "jsx skins/base/views/ build", "start:js": "jsx -w skins/base/views/ build --source-map-inline", "build:css": "catw 'skins/base/css/**/*.css' -o bundle.css -c uglifycss --no-watch", "start:css": "catw 'skins/base/css/**/*.css' -o bundle.css -v", "build": "npm run build:js && npm run build:css", - "start": "parallelshell 'npm run start:js' 'npm run start:css'" + "start": "parallelshell 'npm run start:js' 'npm run start:css'", + "prepublish": "npm run build" }, "dependencies": { "classnames": "^2.1.2",