Angularjs combine requirejs Do file merge compressed those pits

I used the ANGULARJS framework in the project, with Requirejs do asynchronous module loading (AMD), in the file merge compression, encountered some pits, some just solved, but do not understand the reason.

those pits

1. Build.js inside the paths must be consistent with the inside of Main.js.

This build.js is the configuration file used by R.js, and Main.js is the main file of Requirejs. When merging compression, Build.js file inside also need to write paths, and still like main.js, I am very strange why can not identify main inside of the require.config paths, save the merger when also will paths copy over (I tried build.js there is no paths, is not merged). （-_-!!! ）

2. Some dependent libraries need to write the entire relative path in order to merge.

In the project, I use a third-party library called layer (the library is written in Requirejs define), only at the beginning of development, when the paths configuration of the path, the use of this library only need a short name (define dependency time). But when doing the merger, unexpectedly hint file does not exist (because directly take abbreviation to spell file address), helpless under can only modify the use of this library, all use to this library are written the entire relative path, this time to develop and do merge is not wrong.

3. After merging can be run, plus compression can not.

This is the most serious problem, the most serious problem, the most serious problem. After the file merge compression, the use of the file, Angularjs run is not normal, always reported that the module initialization failed,Failed to instantiate module common due to:error: [$injector: UNPR] Unknown Provider:e, such as.

A key point is that no compression can be used, once compressed (using the default compression), the use will be error. So thinking certain things must be "crushed", some articles on the web are said to need to write the following Angularjs cntroller, directive, and so on, using the service is defined by a string.

Commonmodule.controller ("Broswerctrl", ["$scope" ,"$sce"function ($scope, $sce) {

But my entire application is defined in this way and does not give it the chance to inject errors. Finally in frustration, you can only configure Mangle:false, do not confuse the variable name, so that the merged compressed files can be used correctly!!!

PS: The simple argument is that the combination of compression can be, the variable name can not be confused (always feel Weird), feel the problem is not solved.

4. The second layer of require, when merging, is not merged.

For example, in Mian.js the module is loaded so that the second layer of require is not merged when merging.

function () {     function(angular) {           //....      });});

At this time need to Build.js plus findnesteddependencies:true, then the second layer will be merged.

Consolidation Preparation

Installing Nodejs

File merge compression is based on Nodejs, so install Nodejs first,: http://blog.nodejs.org/2013/07/25/node-v0-10-15-stable/

Download R.js

R.js with Requirejs module to merge, compress,: https://github.com/jrburke/r.js

Simple configuration

The configuration file is best written in a build.js, as follows:

({     baseUrl:".) /",     paths: {         //...      },     shim: {         //...      },     " Uglify2 ",     uglify2: {        false  //false does not confuse variable name      } ,     true,     "Js/main",     ".. /js/main-built.js "})

Here are a few key attributes:

BASEURL: All modules (like JS) exist relative to this path.

Optimize: The way to optimize the script file, there are 5 ways to take the following values.

• Uglify: (default) compressed with UGLIFYJS.
• UGLIFY2: Compressed with UglifyJS2 (2.1.2+).
• Closure: Use Google's closure Compiler simple optimization mode to compress files, only in the optimization tool using Java valid.
• Closure.keeplines: The same as the closure parameter, except that the line break is preserved.
• None: Do not compress.

Findnesteddependencies: Look for the dependency of the require or define call inside the require ().

PS: Configuration Properties There are many, it is said, there is an article written very detailed, address: http://segmentfault.com/a/1190000002403806#articleHeader37

When the file is configured, execute the command merge compression

Node R.js-o build.js

Summarize

Requirejs module of the combined compression is relatively simple, but encountered Angularjs, in the compression of some problems, there is no better way to find.

This article for the original article, reproduced please retain the original source, convenient traceability, if there is the wrong place, thank you correct. This address: http://www.cnblogs.com/lovesong/p/5116355.html

Angularjs combine requirejs Do file merge compressed those pits