UNPKG

catreact

Version:

Catavolt Core React Components

53 lines (24 loc) • 2.03 kB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
catreact ========= **This module is the Catavolt React Development Kit** # Using this module in your project * npm install --save catreact # Building the code (for contributors) * If using Typescript (recommended), [WebStorm](https://www.jetbrains.com/webstorm/) is recommended as an ide, as it has very good Typescript support * Install [Node.js](https://nodejs.org/en/) (5+ recommended) directly or use [nvm](https://github.com/creationix/nvm#installation) to easily manage installations * From this project's root directory (catreact), run **'npm install'**. This should install all required packages to the 'node_modules' directory in 'catreact', including the catavolt javascript sdk. # Configuring WebStorm for Typescript: * Open the catreact project root folder in WebStorm * Go to WebStorm -> Preferences -> Languages and Frameworks -> Javascript * Set the Language Level to JSX Harmony * Go to WebStorm -> Preferences -> Languages and Frameworks -> TypeScript panel * Choose 'Enable TypeScript Compiler' * Make sure the path to the Node interpreter is correct * Choose 'Use tsconfig.json' radio option * Click 'Apply' and 'Ok' * Open the TypeScript Compiler panel at the bottom of WebStorm and Choose 'Compile All' from the buttons on the left # Dev Workflow You'll need to run the 'packager' which runs babel (ES6 transpiler) and a 'web formatter' on the javascript generated by your typescript files. This will generate a single 'bundle' file that can be included on webpages. To see an example of this check the 'npm start' script in the package.json file. This script uses 'watchify' with a babel plugin to acheive both transformations. * In a terminal, from the root 'catreact' directory, run **'npm start'** to run the packager in background. The process will watch for file changes and automatically create a new 'bundle.js' everytime you recompile your Typescript * Try running 'index.html' in the 'examples/catavolt-client' directory (right click, run) ---