Skip to content

Commit dff74f4

Browse files
dbkrdbkr
committed
Tweak the example build process. Move example -> examples/trivial to we can have more than one. Update README appropriately.
1 parent 196ee3f commit dff74f4

7 files changed

Lines changed: 32 additions & 27 deletions

File tree

‎.npmignore‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
example
2+
examples
3+
build/.module-cache

‎README.md‎

Lines changed: 17 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -3,34 +3,31 @@ matrix-react-sdk
33

44
This is a react-based SDK for inserting a Matrix chat client into a web page
55

6-
Getting started with the example
7-
================================
6+
Getting started with the trivial example
7+
========================================
88

99
1. Install or update `node.js` so that your `npm` is at least at version `2.0.0`
1010
2. Clone the repo: `git clone https://github.com/matrix-org/matrix-react-sdk.git`
11-
3. Switch to your new checkout: `cd matrix-react-sdk`
12-
4. Build the CSS: `npm install && npm run build:css`
13-
5. Switch to the example: `cd example`
14-
6. Build the javascript & copy the CSS:
15-
`npm install && npm run build && ln -s ../bundle.css ./`
11+
3. Switch to the example directory: `cd matrix-react-sdk/examples/trivial`
12+
4. Install the prerequisites: `npm install`
13+
5. Build the example and start a server: `npm start`
1614

17-
Serve the app from within the `example` directory by running `python -m
18-
SimpleHTTPServer 8000` and access it at
19-
[http://127.0.0.1:8000](http://127.0.0.1:8000/)
15+
Now open http://127.0.0.1:8080/ in your browser to see your newly built
16+
Matrix client.
2017

2118
Using the example app for development
2219
=====================================
2320

24-
To develop using the example app, you can avoid havign to repeat the above
25-
steps each time you change something:
21+
The above commands will let you start working on the app, and any changes you
22+
make to the javascript source files will cause the javascript to be rebuilt
23+
automatically, but the same will not apply for the CSS.
2624

27-
1. Perform all the steps above
28-
2. In the matrix-react-sdk directory: `npm run start:css`
29-
3. Open a new terminal window in the matrix-react-sdk directory:
30-
`cd example; npm start`
25+
To have the CSS bundle also rebuild as you change it:
3126

32-
Now, development version of your Javascript and CSS will be rebuilt whenever
33-
you change any of the files (although you may need to restart the CSS builder
34-
if you add a new file). Note that the debug CSS and Javascript are much, much
35-
larger than the production versions.
27+
1. `cd matrix-react-sdk`
28+
2. `npm start:css`
29+
30+
Note that you may need to restart the CSS builder if you add a new file. Note
31+
that `npm start` builds debug versions of the the javascript and CSS, which are
32+
much larger than the production versions build by the `npm run build` commands.
3633

example/README.md renamed to examples/trivial/README.md

File renamed without changes.

example/index.html renamed to examples/trivial/index.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,6 @@
77
<body style="height: 100%; ">
88
<section id="matrixchat" style="height: 100%; "></section>
99
<script src="bundle.js"></script>
10-
<link rel="stylesheet" href="bundle.css">
10+
<link rel="stylesheet" href="node_modules/matrix-react-sdk/bundle.css">
1111
</body>
1212
</html>

example/lib/index.js renamed to examples/trivial/index.js

File renamed without changes.

example/package.json renamed to examples/trivial/package.json

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -7,17 +7,20 @@
77
"type": "git",
88
"url": "https://github.com/matrix-org/matrix-react-sdk"
99
},
10-
"license": "Apache 2",
10+
"license": "Apache-2.0",
1111
"devDependencies": {
1212
"browserify": "^10.2.3",
1313
"envify": "^3.4.0",
14-
"matrix-react-sdk": "../",
14+
"http-server": "^0.8.0",
15+
"matrix-react-sdk": "../../",
16+
"npm-css": "^0.2.3",
17+
"parallelshell": "^1.2.0",
1518
"reactify": "^1.1.1",
1619
"uglify-js": "^2.4.23",
1720
"watchify": "^3.2.1"
1821
},
1922
"scripts": {
20-
"build": "browserify -t [ envify --NODE_ENV production ] -t reactify lib/index.js | uglifyjs -c -m -o bundle.js",
21-
"start": "watchify -v -d -t reactify lib/index.js -o bundle.js"
23+
"build": "browserify -t [ envify --NODE_ENV production ] -t reactify index.js | uglifyjs -c -m -o bundle.js",
24+
"start": "parallelshell 'watchify -v -d -t reactify index.js -o bundle.js' 'http-server'"
2225
}
2326
}

‎package.json‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,15 +7,17 @@
77
"type": "git",
88
"url": "https://github.com/matrix-org/matrix-react-sdk"
99
},
10-
"license": "Apache 2",
10+
"license": "Apache-2.0",
1111
"main": "src/index.js",
12+
"style": "bundle.css",
1213
"scripts": {
1314
"build:js": "jsx skins/base/views/ build",
1415
"start:js": "jsx -w skins/base/views/ build --source-map-inline",
1516
"build:css": "catw 'skins/base/css/**/*.css' -o bundle.css -c uglifycss --no-watch",
1617
"start:css": "catw 'skins/base/css/**/*.css' -o bundle.css -v",
1718
"build": "npm run build:js && npm run build:css",
18-
"start": "parallelshell 'npm run start:js' 'npm run start:css'"
19+
"start": "parallelshell 'npm run start:js' 'npm run start:css'",
20+
"prepublish": "npm run build"
1921
},
2022
"dependencies": {
2123
"classnames": "^2.1.2",

0 commit comments

Comments
 (0)