Browse Source

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

pull/1/head
David Baker 7 years ago
parent
commit
dff74f44de
  1. 3
      .npmignore
  2. 37
      README.md
  3. 0
      examples/trivial/README.md
  4. 2
      examples/trivial/index.html
  5. 0
      examples/trivial/index.js
  6. 11
      examples/trivial/package.json
  7. 6
      package.json

3
.npmignore

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

37
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.

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

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

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

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

11
example/package.json → 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'"
}
}

6
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",

Loading…
Cancel
Save