1313* Provides a mechanism by which multiple multiple JS applications can be
1414 compiled in the same project.
1515
16- * Provides a mechanism by which JS preamble, and Google Closure libs and
17- externs files can be included in Maven jar dependencies or from the project
18- source directories.
19-
2016## Try It
2117
2218In a terminal do:
@@ -44,7 +40,7 @@ You can see the options available on the command line:
4440boot cljs -h
4541```
4642
47- or in the REPL:
43+ Or in the REPL:
4844
4945``` clj
5046boot.user=> (doc cljs)
@@ -83,31 +79,6 @@ JavaScript:
8379<script type =' text/javascript' src =' main.js' ></script >
8480```
8581
86- Since the Closure compiler concatenates the individual JS files this is all
87- you need for the production version of your application.
88-
89- For development, however, the Closure compiler is bypassed and no concatenation
90- is done, so you normally need to add two other ` <script> ` tags for the Closure
91- ` base.js ` dependency and to ` goog.require() ` your main namespace, plus tags to
92- load any external JS libraries your application depends on:
93-
94- ``` html
95- <!-- external JS libraries -->
96- <script type =' text/javascript' src =' react.min.js' ></script >
97- <script type =' text/javascript' src =' jquery.min.js' ></script >
98-
99- <!-- compiling with optimizations == none -->
100- <script type =' text/javascript' src =' out/goog/base.js' ></script >
101- <script type =' text/javascript' src =' main.js' ></script >
102- <script type =' text/javascript' >goog .require (' my.namespace' ); </script >
103- ```
104-
105- ** This is not necessary with the boot ` cljs ` task.** The ` cljs ` task is smart
106- enough to arrange all of this for you automatically, so the application HTML
107- file can be the same whether compiling with or without optimizations. You only
108- need the one ` <script> ` tag as in the first example above. This will work with
109- all compilation levels.
110-
11182### Source Maps
11283
11384[ Source maps] [ src-maps ] associate locations in the compiled JavaScript file with
@@ -156,7 +127,7 @@ The `cljs` task provides a way to specify application entry points at which it
156127can point the CLJS compiler for compilation. These entry points are provided
157128via files with the ` .cljs.edn ` extension.
158129
159- These files have the following structure (eg . ` js/index.cljs.edn ` ):
130+ These files have the following structure (e.g . ` js/index.cljs.edn ` ):
160131
161132``` clojure
162133{:require [foo.bar baz.baf]
@@ -166,7 +137,7 @@ These files have the following structure (eg. `js/index.cljs.edn`):
166137
167138For each ` .cljs.edn ` file in the fileset, the ` cljs ` task will:
168139
169- * Create a CLJS namespace corresponding to the file's path, eg . given the file
140+ * Create a CLJS namespace corresponding to the file's path, e.g . given the file
170141 ` foo/bar.cljs.edn ` it will create the ` foo.bar ` CLJS namespace. This namespace
171142 will ` :require ` any namespaces given in the ` :require ` key of the EDN, and
172143 add a ` do ` expression that calls any functions in ` :init-fns ` at the top
@@ -176,7 +147,7 @@ For each `.cljs.edn` file in the fileset, the `cljs` task will:
176147 if there is one.
177148
178149* Configure the compiler to produce compiled JS at a location derived from the
179- file's path, eg . given the file ` foo/bar.cljs.edn ` the output JS file will
150+ file's path, e.g . given the file ` foo/bar.cljs.edn ` the output JS file will
180151 be ` foo/bar.js ` .
181152
182153* Point the CLJS compiler at the generated namespace only. This "scopes" the
@@ -192,33 +163,37 @@ The example above would result in the following CLJS namespace, `js/index.cljs`:
192163 (baz.baf/doit ))
193164```
194165
195- and would be compiled to ` js/index.js ` . This is the JS script you'd add to the
196- application's HTML file via a ` <script> ` tag.
166+ The result would be compiled to ` js/index.js ` . This is the JS script you'd add
167+ to the application's HTML file via a ` <script> ` tag.
197168
198169### Browser REPL
199170
200171See the [ adzerk/boot-cljs-repl] [ boot-cljs-repl ] boot task.
201172
202- ### Preamble, Externs, and Lib Files
173+ ### Preamble and Externs Files
203174
204175Jars with ` deps.cljs ` , like the ones provided by [ cljsjs] [ cljsjs ] can
205- be used to supply Javascript libraries. Alternatively the mechanism
206- described below can be used :
176+ be used to supply Javascript libraries. If you need to use local js files
177+ you can manually create deps.cljs in your local project :
207178
208- The ` cljs ` task scans the fileset for files that have special filename
209- extensions. File extensions recognized by the ` cljs ` task:
210-
211- * ` .inc.js ` : JavaScript preamble files–these are prepended to the compiled
212- Javascript in dependency order (i.e. if jar B depends on jar A then entries
213- from A will be added to the JavaScript file such that they'll be evaluated
214- before entries from B).
179+ src/deps.cljs:
180+ ``` clj
181+ {:foreign-libs [{:file " bar.js"
182+ :provides [" foo.bar" ]}]
183+ :externs [" bar.ext.js" ]}
184+ ```
215185
216- * ` .lib.js ` : GClosure lib files (JavaScript source compatible with the Google
217- Closure compiler).
186+ src/bar.js:
187+ ``` js
188+ function foo () {
189+ console .log (" Hello world from local js" );
190+ }
191+ ```
218192
219- * ` .ext.js ` : [ GClosure externs files] [ closure-externs ] –hints to the Closure
220- compiler that prevent it from mangling external names under advanced
221- optimizations.
193+ src/bar.ext.js:
194+ ``` js
195+ foo = function () {};
196+ ```
222197
223198## Examples
224199
@@ -233,7 +208,7 @@ my-project
233208 └── foop.cljs
234209```
235210
236- and add the following contents to ` build.boot ` :
211+ And add the following contents to ` build.boot ` :
237212
238213``` clj
239214(set-env!
@@ -252,66 +227,21 @@ boot cljs -s
252227
253228The compiled JavaScript file will be ` target/main.js ` .
254229
255- ### Preamble and Externs
256-
257- Add preamble and extern files to the project, like so:
258-
259- ```
260- my-project
261- ├── build.boot
262- ├── html
263- │ └── index.html
264- └── src
265- ├── foop.cljs
266- └── js
267- ├── barp.ext.js
268- └── barp.inc.js
269- ```
270-
271- With the contents of ` barp.inc.js ` (a preamble file):
272-
273- ``` javascript
274- (function () {
275- window .Barp = {
276- bazz : function (x ) {
277- return x + 1 ;
278- }
279- };
280- })();
281- ```
282-
283- and ` barp.ext.js ` (the externs file for ` barp.inc.js ` ):
284-
285- ``` javascript
286- var Barp = {};
287- Barp .bazz = function () {};
288- ```
289-
290- Then, in ` foop.cljs ` you may freely use ` Barp ` , like so:
291-
292- ``` clj
293- (ns foop )
294-
295- (.log js/console " Barp.bazz(1) ==" (.bazz js/Barp 1 ))
296- ```
297-
298230Compile with advanced optimizations and source maps:
299231
300232``` bash
301233boot cljs -sO advanced
302234```
303235
304- You will see the preamble inserted at the top of ` main.js ` , and the references
305- to ` Barp.bazz() ` are not mangled by the Closure compiler. Whew!
306-
307236### Further Reading
308237
309238For an example project with a local web server, CLJS REPL, and live-reload,
310239check out [ boot-cljs-example] !
311240
312241## License
313242
314- Copyright © 2014 Adzerk
243+ Copyright © 2014 Adzerk<br >
244+ Copyright © 2015 Juho Teperi
315245
316246Distributed under the Eclipse Public License either version 1.0 or (at
317247your option) any later version.
0 commit comments