El siguiente post me inspiró a echar un vistazo a limeJS, como un proyecto paralelo en el que estoy trabajando en un juego de Yatzee (en su mayoría apagado) y pensé que podría ser una buena biblioteca para usar.

Como principiante en el cierre de Google, tuve algunas dificultades para ejecutar código no compilado y compilarlo, principalmente porque no sabía cuáles eran las opciones y los comandos y debido a las dependencias.

Para otros principiantes con google-closuse he escrito este tutorial.

Tenga en cuenta que jQuery puede ser utilizado por su código compilado de cierre, pero necesita jQueryarchivo externo. No puede compilar jQuery en su código, la biblioteca de cierre tiene un dojo que se puede encontrar en third_party. Al usar eso puedes compilar tu código en un archivo.

Que necesitas:PitónCliente gitCompilador de cierre para compilar código (minimizando y fusionando todos los archivos en uno)Biblioteca de cierre como jQuery y jQuery ui pero puede compilarse junto con su códigoPython (yo uso 2.7)LimeJS Como biblioteca de terceros (use git client para obtenerlo, la url:https://github.com/digitalfruit/limejs.git)JAVA JREEstructura de directorios

Estoy usando Windows y tengo mis proyectos en D: \ projects, si tienes tus proyectos en otro lugar, tienes que reemplazar las referencias de D: \ projects por las tuyas.

En D: \ projects hago un directorio llamado bibliotecas en ese directorio copio los directorios goog y third_party de la biblioteca de cierre (goog está debajo del directorio de cierre) ya que los usará para muchos proyectos, lo guardo en la raíz de los proyectos, puede Incluya una copia en cada proyecto que cree, pero en este caso compartiré la biblioteca entre todos los proyectos.

Ahora copio el contenido del directorio src desde limeJS ([lime clone dir] \ lime \ src) a D: \ projects \raries \ lime (el que contiene los subdirectorios llamados animación, audio ...).

A continuación, usaré un proyecto existente de la biblioteca limeJS, copiaré [lime clone dir] \ lime \ demos \ roundball a D: \ projects \ roundball

En este momento, la estructura de su directorio debería verse así:

RE:proyectosbibliotecasgoogLimaanimaciónaudiocss...tercerocierre...bola redondabienes... otras cosas de roundballcacldeps.py

Cuando abra D: \ projects \ roundball \ rb.html y verifique la consola (presione F12 en Chrome o en FireFox, preferiblemente teniendo instalado el complemento Firebug) verá un error:"ReferenceError: goog no está definido"

Abra D: \ projects \ roundball \ rb.html y cambie:

<script type="text/javascript" src="../../../closure/closure/goog/base.js"></script>

a

<script type="text/javascript" src="../libraries/goog/base.js"></script>

Ahora, cuando abres de nuevo rb.html, obtienes un error diferente:"goog.require no pudo encontrar: lime.Director"

Esto se debe a que el cierre usa deps.js para encontrar dependencias y, como la cal no está allí, no puede encontrarla. Por suerte para nosotros, existe una herramienta llamada calcdeps.py en el directorio bin de la biblioteca de cierre que puede crear este archivo para nosotros. Se verá en su código y utilizará goog. Consulte para averiguar qué otros archivos se necesitan. Si su estructura de archivos es buena, esta herramienta la encontrará.

Esperará que el Director esté en un archivo llamado director.js en un directorio llamado lime (y lo está). Ese archivo js debe tener una declaración goog.provide que proporcione lime.Director.

Puede agregar directorios para que calcdeps.py busque con el--camino parámetro.

En D: \ projects \ roundball crearé un makedeps.bat con el siguiente contenido:

set calc="D:\software\closure compiler\library\closure\bin\calcdeps.py"
c:\Python27\python.exe %calc% ^
--path D:\projects\roundball\ ^
--path D:\projects\libraries\ ^
--input D:\projects\roundball\rb.js ^
--output_mode deps ^
--output_file D:\projects\libraries\goog\deps.js
pause

El código no compilado utiliza /goog/deps.js para cargar dependencias. caclcdeps.py comprobará su código comenzando con rb.js (ya que este es el punto de inicio del código) y agregará entradas a deps.js de acuerdo con lo que usa su proyecto.

Una vez más, cacldeps.py se puede encontrar en el directorio bin de la biblioteca de cierre.

Tenga en cuenta que cuando tenga otro proyecto; digamos D: \ projects \ project2, entonces tiene que crear un makedeps.bat en ese directorio del proyecto que crea los deps.js por usted antes de poder ejecutar el código no compilado. Esto se debe a que varios proyectos comparten una biblioteca de cierre de Google, de modo que cuando cambie de proyecto, asegúrese de compilar primero los deps.js antes de ejecutar el código no compilado.

Resolviendo la dependencia perdida

Al abrir el archivo rt.html, seguimos recibiendo un error, pero uno diferente: Error:"Undefined nameToPath para lime.css"

Buscando en goog / deps.js podemos encontrar que lime.css es necesario para lima pero no tiene una entrada en deps.js. ¿Por qué es esto? Buscando en D: \ projects \raries \ lime no hay un directorio css o un archivo css.js. Pero en el directorio donde clonó el proyecto git lime hay un directorio llamado css.

Copie el directorio css en D: \ projects \raries \ lime y ejecute makedeps.bat de nuevo, ahora cuando abra rt.html se ejecutará.

Todo está sin compilar y puede establecer puntos de interrupción para ingresar en el código de un tercero.

Compila tu codigo

En producción querría compilar el código en un archivo. Para compilar el código, creé un compile.bat en D: \ projects \ roundball con el siguiente contenido:

set calc="D:\software\closure compiler\library\closure\bin\calcdeps.py"
c:\Python27\python.exe %calc% ^
--path D:\projects\roundball\ ^
--path D:\projects\libraries\ ^
--input D:\projects\roundball\rb.js ^
--compiler_jar "D:\software\closure compiler\compiler.jar" ^
--output_mode compiled ^
--compiler_flags="--compilation_level=ADVANCED_OPTIMIZATIONS" ^
--compiler_flags="--formatting=PRETTY_PRINT" ^
--output_file D:\projects\roundball\compiled\roundball.js
pause

;Need this flag for production compile:
;--compiler_flags="--define goog.DEBUG=false" ^
;Remove the following flag from production compile:
;--compiler_flags="--formatting=PRETTY_PRINT" ^
;lime libraries is giving me errors with stricter compilation
;  so had to remove this flag (have to fix the errors or no type checking for your code)
;--compiler_flags="--warning_level=VERBOSE" ^

El archivo compiler.jar se puede encontrar donde descargó (y extrajo) el compilador de cierre

Ahora, cuando ejecute compile.bat y abra D: \ projects \ roundball \ compiled \ roundball.html, verá en las herramientas de desarrollo de su navegador que solo se carga roundball.js.