OLD | NEW |
1 # Vulcanizing Chrome Polymer UIs | 1 # Vulcanizing Chrome Polymer UIs |
2 | 2 |
3 `vulcanize` is an npm module used to combine resources. In order to make the | 3 `vulcanize` is an npm module used to combine resources. In order to make the |
4 Material Design downloads and history pages sufficiently fast, we run vulcanize | 4 Material Design downloads and history pages sufficiently fast, we run vulcanize |
5 on the source files to combine them and reduce blocking load/parse time. | 5 on the source files to combine them and reduce blocking load/parse time. |
6 | 6 |
7 ## Required software | 7 ## Required software |
8 | 8 |
9 Vulcanization currently requires: | 9 Vulcanization currently requires: |
10 | 10 |
11 - node.js: >= v4.4.2 (can be found with `node --version`) | 11 - node.js: >= v4.4.2 (can be found with `node --version`) |
12 - npm: >= 1.3.10 (can be found with `npm --version`) | 12 - npm: >= 1.3.10 (can be found with `npm --version`) |
13 - vulcanize: 1.14.8 (can be found with `vulcanize --version`) | 13 - vulcanize: 1.14.8 (can be found with `vulcanize --version`) |
14 - crisper: 2.0.1 (can be found with `npm list -g crisper`) | 14 - crisper: 2.0.1 (can be found with `npm list -g crisper`) |
15 - uglifyjs: 2.4.10 (can be found with `uglifyjs --version`) | 15 - uglifyjs: 2.4.10 (can be found with `uglifyjs --version`) |
| 16 - polymer-css-build: 0.0.6 (can be found with `npm list -g polymer-css-build`) |
16 | 17 |
17 ## Installing required software | 18 ## Installing required software |
18 | 19 |
19 For instructions on installing node and npm, see | 20 For instructions on installing node and npm, see |
20 [here](https://docs.npmjs.com/getting-started/installing-node). | 21 [here](https://docs.npmjs.com/getting-started/installing-node). |
21 | 22 |
22 We recommend telling npm where to store downloaded modules: | 23 We recommend telling npm where to store downloaded modules: |
23 | 24 |
24 ```bash | 25 ```bash |
25 $ npm config set -g prefix "$HOME/node_modules" | 26 $ npm config set -g prefix "$HOME/node_modules" |
26 ``` | 27 ``` |
27 | 28 |
28 Then install the required modules: | 29 Then install the required modules: |
29 | 30 |
30 ```bash | 31 ```bash |
31 $ npm install -g crisper vulcanize | 32 $ npm install -g crisper vulcanize uglifyjs polymer-css-build |
32 ``` | 33 ``` |
33 | 34 |
34 Ultimately, all that is required to run this script is that `crisper`, 'uglify' | 35 Ultimately, all that is required to run this script is that the node binaries |
35 and `vulcanize` are on your `$PATH`. | 36 listed above are on your $PATH. |
36 | 37 |
37 ## Combining resources with vulcanize | 38 ## Combining resources with vulcanize |
38 | 39 |
39 To combine all the CSS/HTML/JS for all pages which use vulcanize, making them | 40 To combine all the CSS/HTML/JS for all pages which use vulcanize, making them |
40 production fast, you can run the command: | 41 production fast, you can run the command: |
41 | 42 |
42 ```bash | 43 ```bash |
43 $ chrome/browser/resources/vulcanize.py # from src/ | 44 $ chrome/browser/resources/vulcanize.py # from src/ |
44 ``` | 45 ``` |
45 | 46 |
46 This should overwrite the following files: | 47 This should overwrite the following files: |
47 | 48 |
48 - chrome/browser/resources/md_downloads/ | 49 - chrome/browser/resources/md_downloads/ |
49 - vulcanized.html (all <link rel=import> and stylesheets inlined) | 50 - vulcanized.html (all <link rel=import> and stylesheets inlined) |
50 - crisper.js (all JavaScript, extracted from vulcanized.html) | 51 - crisper.js (all JavaScript, extracted from vulcanized.html) |
51 - chrome/browser/resources/md_history/ | 52 - chrome/browser/resources/md_history/ |
52 - app.vulcanized.html | 53 - app.vulcanized.html |
53 - app.crisper.js | 54 - app.crisper.js |
54 | 55 |
55 ## Testing downloads without vulcanizing | 56 ## Testing downloads without vulcanizing |
56 | 57 |
57 Build with `use_vulcanize = false` in your gn args to build without vulcanizing. | 58 Build with `use_vulcanize = false` in your gn args to build without vulcanizing. |
OLD | NEW |