I want to write coffeescript that would read a file at compile time and produce a javascript file that initializes a variable with the file contents.
My app has a bunch of error messages and stubs that need to be maintained independently by copy editors and such. But all of them need to be inline in the js that is served to the client browser.
Are there 'pre-processor' directives that will let me do this?
Javasccript in and of itself doesn't have this capability. So what you are trying to do is not a good practice. The variables that you are trying to change on compile time, keep them in a separate javascript file. Then while building your project, initialize those variables in the separate file and concat them to serve (possibly minified) javascript file. There are tools available to do this. Check out uglify and grunt
Related
I'm just starting out with AngularJS (1.4.7) and hoping to produce a concise build output using Closure Compiler for a new application.
I'm successfully generating a single output file containing all my application's JavaScript preceded by each of the libraries on which it depends.
However, my application uses ngRoute and this is loading a controller and a partial html template for each route when visited. Each template is loaded as required so the first time a route is used there is a delay as the template downloads.
I'm used to working with RequireJS in which a template can be treated as a resource and bundled into the compiled build product, however I don't see a way to do this with Angular and Closure.
I assume this is a problem that has previously been addressed but I've had a very hard time finding relevant information via Google.
Is it possible to include partial templates in a build product, produced either with Closure Compiler or some other tool?
The best way to handle this is a two step process:
Use the r.js optimizer to order your dependencies and create a single JS file.
Use closure-compiler to compress the output file from r.js.
The require js optimizer is available as both a grunt and gulp plugin.
With gulp, you would simply pipe the requirejs output into a compilation task. For grunt, you'll need to set the optimize property to none and generate an intermediate file. The intermediate file will be your js input file for closure-compiler.
Okay so I'm trying to intergrate React into an existing codebase. Currently we have a single page web-app that is operated by a common.js, however I have noticed that if JSX files or at least script files that are loaded as 'type="text/jsx"' in the HTMl file fail to appear within the scope of JS files. This creates a problem as we now have no way of manipulating the React components after initialization without refactoring an obscene amount of code. Common.js can't be transformed to JSX because we have external files/libraries that rely on it's scope.
You can "compile" your jsx files directly from the terminal. That way, you don't have to put type="text/jsx" because it will just be js code.
Here's an npm command line compiler called jsx
If you're using NodeJS for your server, you can use express-jsx middleware to compile your code on the fly.
I'm working on an application using typescript. The code of my app is designed as follows:
Solution's Explorer
I've two questions:
How to build one .js file per module? Today I've one project per module, so the VS2013 build one .js file per module but I don't know if this approach is the best available.
How to reference the modules on the GlobalAppModule, if I put the references in TypeScript directly, VS2013 build the code of one module in another's.
My original idea was to have only one project in my solution and create a build script to build which module to his own .js file.
The compiler should output one JavaScript file for each input TypeScript source file. If you are seeing all your TypeScript source get combined into one JavaScript file per project, could you please check the project properties, and on the "TypeScript Build" tab ensure that "Combine JavaScript output into file" is not checked (this maps to the "--out" command-line parameter).
To reference files across projects, you can either:
Reference the code directly via "/// " tags. This will however pull that referenced code into the compilation, which may not be desirable across projects.
Choose to "Generate declaration files" for the build of the project to reference ("--declaration" on the command-line). This will create a "*.d.ts" file describing the types in the project. You can then reference this declaration file in the other project (which will cause all the types to appear and be accessible, but won't pull in the actual source from the other project).
I hope this helps.
In Node.js, you can dynamically "require()" any javascript file likewise to PHP's require. I'd like to use this in my client-side code just for ease of development but not actually call a javascript function, but have a compiler replace the line with the contents of the respective file; effectively concatenating the files, not one after another, but inline within the code of one of the files. The closest thing I have found to this is smash. Are there any compilers, minifiers, etc that can do this?
Browserify might not be exactly what you want but it does definitely help with the ease of development issue. When you use Browserify, your code is your build tool. Browserify gives you all the benefits of writing code in node (no anon functions to avoid globals, npm, simple requires, imports instead of namespaced globals) and it allows you to package that code to run on the client with one command and only load one file.
You can checkout my open source js framework Luc JS for an example. It runs on node and IE6. I'm able keep the code modular and build the single browser file with a one line command.
I have many JS files. Some of them depend on each other. Many of them depend on jQuery.
I need tool that can accept one file as parameter, fetch all its dependencies transitively and compile them into one file in proper order (based on dependencies)
Dependency information not always available inside files itself, so it would be nice to have it somewhere outside (xml file? folder structure?)
I've heard about Yahoo JS compiler, closure and so on, but I am not sure they do what I need.
Look: I have module "CustomerPage". It sould include "validation.js" and "gui.js". Both require jquery.js. And "gui.js" also requires "myFunctions.js".
I want some ant task or some script that would generate "CustomerPage.js" as result of all that files.
Tool should check dependency order, prevent double including and so on.
My project could have around 500 js files, how could I live with out of this tool?
People says "use GWT", but I need plain JS.
You might want to look at one of the AMD-style module loaders, such as RequireJS. Some of these can do what you want for precompiling, and can run in a development mode which makes it easier to debug by including all the files directly.