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
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
|
# Closure Tools for Bazel
## Overview
These rules define targets for JavaScript, stylesheets, and templates that will
be compiled with the Closure Tools toolchain. The following rules are defined:
* `closure_js_binary`
* `closure_js_library`
* `closure_stylesheet_library`
* `closure_template_library`
## Setup
The rules defined in `//tools/build_rules/closure/closure.WORKSPACE` must be
copied into your `WORKSPACE` file before using these rules. These rules define
the locations of the various Closure Tools binaries.
You must also have a local copy of the Closure Library source code and reference
the path in your WORKSPACE file. The following commands provide an example of
how this can be accomplished:
```bash
mkdir -p src/github/google
pushd src/github/google
git clone https://github.com/google/closure-library.git
popd
```
Finally, modify your WORKSPACE file:
```python
new_local_repository(
name = "closure_library",
build_file = "tools/build_rules/closure/closure_library.BUILD",
path = "/home/user/src/github/google/closure-library",
)
```
## Usage
Suppose we are building a web application with template, stylesheet, and
JavaScript files: `hello.soy`, `hello.gss`, and `hello.js`.
`hello.soy`
```
{namespace hello.templates autoescape="strict"}
/**
* Renders an element containing the text "hello".
*/
{template .hello}
<div class="{css hello-container}">Hello.</div>
{/template}
```
`hello.gss`
```css
.hello-container {
color: red;
font-weight: bold;
}
```
`hello.js`
```javascript
goog.provide('hello');
goog.require('goog.soy');
goog.require('hello.templates');
goog.soy.renderElement(document.body, hello.templates.hello);
```
We can create a BUILD file to compile these and produce two files:
* `hello_combined.css`
* `hello_combined.js`
`BUILD`
```python
load("/tools/build_rules/closure/closure_js_binary", "closure_js_binary")
load("/tools/build_rules/closure/closure_js_library", "closure_js_library")
load("/tools/build_rules/closure/closure_stylesheet_library", "closure_stylesheet_library")
load("/tools/build_rules/closure/closure_template_library", "closure_template_library")
closure_js_binary(
name = "hello",
main = "hello",
deps = [":hello_lib"],
)
closure_js_library(
name = "hello_lib",
srcs = ["hello.js"],
deps = [
"@closure_library//:closure_library",
"@closure_templates//:closure_templates_js",
":hello_css",
":hello_soy",
]
)
closure_stylesheet_library(
name = "hello_css",
srcs = ["hello.gss"],
)
closure_template_library(
name = "hello_soy",
srcs = ["hello.soy"],
)
```
## Known Issues
The version of the Closure Templates compiler that is used will emit warnings
about an invalid JSDOc tag (@notypecheck) and about a missing enum value. These
issues have been fixed in the source, but are not yet available as a
downloadable archive. These warnings are safe to ignore.
You may define a new_local_repository target if you wish to check out the source
from Github yourself. Otherwise you may wish to wait until the Closure tools are
available as Bazel workspaces.
|