PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 3

Tweak the example build process. Move example -> examples/trivial to we can have more than one. Update README appropriately.

Browse source
This commit is contained in:
David Baker 2015-07-03 15:56:04 +01:00
parent 196ee3f6d4
commit dff74f44de
7 changed files with 32 additions and 27 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
.npmignore Normal file
View file

@ -0,0 +1,3 @@
example
examples
build/.module-cache

37
README.md
View file

@ -3,34 +3,31 @@ matrix-react-sdk
This is a react-based SDK for inserting a Matrix chat client into a web page 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` 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` 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` 3. Switch to the example directory: `cd matrix-react-sdk/examples/trivial`
4. Build the CSS: `npm install && npm run build:css` 4. Install the prerequisites: `npm install`
5. Switch to the example: `cd example` 5. Build the example and start a server: `npm start`
6. Build the javascript & copy the CSS:
`npm install && npm run build && ln -s ../bundle.css ./`
Serve the app from within the `example` directory by running `python -m Now open http://127.0.0.1:8080/ in your browser to see your newly built
SimpleHTTPServer 8000` and access it at Matrix client.
[http://127.0.0.1:8000](http://127.0.0.1:8000/)
Using the example app for development Using the example app for development
===================================== =====================================
To develop using the example app, you can avoid havign to repeat the above The above commands will let you start working on the app, and any changes you
steps each time you change something: 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 To have the CSS bundle also rebuild as you change it:
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`
Now, development version of your Javascript and CSS will be rebuilt whenever 1. `cd matrix-react-sdk`
you change any of the files (although you may need to restart the CSS builder 2. `npm start:css`
if you add a new file). Note that the debug CSS and Javascript are much, much
larger than the production versions. 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.

0
example/README.md → examples/trivial/README.md
View file

2
example/index.html → examples/trivial/index.html
View file

@ -7,6 +7,6 @@
<body style="height: 100%; "> <body style="height: 100%; ">
<section id="matrixchat" style="height: 100%; "></section> <section id="matrixchat" style="height: 100%; "></section>
<script src="bundle.js"></script> <script src="bundle.js"></script>
<link rel="stylesheet" href="bundle.css"> <link rel="stylesheet" href="node_modules/matrix-react-sdk/bundle.css">
</body> </body>
</html> </html>

0
example/lib/index.js → examples/trivial/index.js
View file

11
example/package.json → examples/trivial/package.json
View file

@ -7,17 +7,20 @@
"type": "git", "type": "git",
"url": "https://github.com/matrix-org/matrix-react-sdk" "url": "https://github.com/matrix-org/matrix-react-sdk"
}, },
"license": "Apache 2", "license": "Apache-2.0",
"devDependencies": { "devDependencies": {
"browserify": "^10.2.3", "browserify": "^10.2.3",
"envify": "^3.4.0", "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", "reactify": "^1.1.1",
"uglify-js": "^2.4.23", "uglify-js": "^2.4.23",
"watchify": "^3.2.1" "watchify": "^3.2.1"
}, },
"scripts": { "scripts": {
"build": "browserify -t [ envify --NODE_ENV production ] -t reactify lib/index.js | uglifyjs -c -m -o bundle.js", "build": "browserify -t [ envify --NODE_ENV production ] -t reactify index.js | uglifyjs -c -m -o bundle.js",
"start": "watchify -v -d -t reactify lib/index.js -o bundle.js" "start": "parallelshell 'watchify -v -d -t reactify index.js -o bundle.js' 'http-server'"
} }
} }

6
package.json
View file

@ -7,15 +7,17 @@
"type": "git", "type": "git",
"url": "https://github.com/matrix-org/matrix-react-sdk" "url": "https://github.com/matrix-org/matrix-react-sdk"
}, },
"license": "Apache 2", "license": "Apache-2.0",
"main": "src/index.js", "main": "src/index.js",
"style": "bundle.css",
"scripts": { "scripts": {
"build:js": "jsx skins/base/views/ build", "build:js": "jsx skins/base/views/ build",
"start:js": "jsx -w skins/base/views/ build --source-map-inline", "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", "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", "start:css": "catw 'skins/base/css/**/*.css' -o bundle.css -v",
"build": "npm run build:js && npm run build:css", "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": { "dependencies": {
"classnames": "^2.1.2", "classnames": "^2.1.2",