R.js Compressed packaging (require + backbone) project development files

Recently the project has stabilized a little, the development file compression packaging problem that has not been paid attention to before has time to solve

Code Compression Packaging Tool--r.js in AMD Modular development

Environment building based on Nodejs; project file compression packaging for AMD modular development is not AMD mode is also possible

JavaScript partial compression JavaScript project Development folder

Build.js Compressed Package configuration file, file name can be arbitrary

12345678910111213141516171819202122232425

({    appDir  : ‘./project‘, //基于build，根目录    baseUrl : ‘./‘, //基于appDir，项目目录    dir     : ‘./project.min‘, //基于build，输出目录    locale  : ‘en-us‘, //国际化配置    optimize: ‘uglify‘, //压缩方式    paths   : {        underscore: ‘../underscore.min‘,        backbone  : ‘../backbone.min‘,        jquery    : ‘../jquery.min‘,        ...    },    modules: [        {            name: ‘main‘ //配置        },        {            name: ‘./controller/init‘ //控制器        },        {            name: ‘./view/index‘ //首页        },        ...    ]})

Build.js BaseURL value is preferably set to the same path as the BaseURL value in Main.js, so that paths can be copied directly, or you need to re-configure the relative path for each module, in addition, the Appdir value is set directly to the project folder path, you can avoid compressing to files outside the project folder

Modules set the merge compression module, the relative path should be configured based on BaseURL

All set modules (i.e. files, the same as the same), the module and all of its dependent modules will be merged and compressed; No module is set, the module will be compressed directly without merging with its dependent modules

R.js provides the following optimize values, the compression method

1234	none：不压缩代码uglify：使用UglifyJS，默认closure：使用Google‘s Closure Compiler，简单优化closure.keepLines：使用Closure，换行

Module configuration (personal program, welcome to discuss the perfect)

Our project is divided into 3 modules, the inlet configuration module Main, controller module controllers, view module views

Main merge compression frame, plug-in and Portal configuration module, once the file has been done very few changes, the retention of the cache is better, set Urlargs after the file will not have a version number

Controller merge and compress the Common module and control module; Set Urlargs after the file has version number clear cache

View merge compresses model and view module; file has version number after setting Urlargs clear cache

Compressing a single JavaScript file

1234567891011121314

({    appDir  : ‘./project‘, //基于build，根目录    baseUrl : ‘./‘, //基于appDir，项目目录    name    : ‘./view/index‘, //基于baseUrl，项目文件    out     : ‘./view/index.min‘, //基于baseUrl，输出文件    locale  : ‘en-us‘, //国际化配置    optimize: ‘uglify‘, //压缩方式    paths   : {        underscore: ‘../underscore.min‘,        backbone  : ‘../backbone.min‘,        jquery    : ‘../jquery.min‘,        ...    }})

Start compressing JavaScript files

The command line enters the folder where the file is located, the command line runs node, finds the r.js; Directly processes the configuration file

1	node r.js -o build.js

No configuration files, direct compression of JavaScript files

1	node r.js -o baseUrl=project name=view\index out=view\index.min.js optimize=uglify

BAT one-click Compression packaging

The current directory where you want to run the bat-based file

12	cd ..\project\static\jsnode r.js -o build.js

CSS Sectionstart compressing CSS files

The command line enters the folder where the file is located, the command line runs node, locate R.js;cssin pointing to the file to be compressed, out points to the compressed file, such as the compressed file will be automatically generated

1	node ..\js\r.js -o cssIn=index.css out=index.min.css optimizeCss=standard

Relative path something must find the right, or it will be an error

R.js provides the following OPTIMIZECSS values, the compression method

12345

none：不压缩，仅合并standard：标准压缩 去换行、空格、注释standard.keepLines：除标准压缩外，保留换行standard.keepComments：除标准压缩外，保留注释standard.keepComments.keepLines：除标准压缩外，保留换行注释

bat One-click Compression packaging

Note the same situation

1234	cd ..\project\static\cssnode ..\js\r.js -o cssIn=index.css  out=index.min.css  optimizeCss=standardnode ..\js\r.js -o cssIn=login.css  out=login.min.css  optimizeCss=standardnode ..\js\r.js -o cssIn=detail.css out=detail.min.css optimizeCss=standard

R.js Compressed packaging (require + backbone) project development files