Seajs module compression problem and solution example analysis

This article describes the seajs module compression problem and solution. Share it for your reference, as follows:

When optimizing and organizing project code, I want to use seajs to modularize the code. After reading the official 5-minute tutorial, I thought it was very good, and I kept developing it without thinking too much, and there was no problem. When a colleague said that he would pack the code and put it on the device to test it, he found that he couldn't run anyway and was depressed.

So I debugged it step by step and found that the module could not be added. I looked at the original code of seajs and understood what was going on.

There are two ways to resolve dependencies from the define module. One is todefine(id, deps, factory)deps in; another type is to parse the define code and come from require. Let's take a look at the code:

 = function (id, deps, factory) {
 var argsLen = 
 // define(factory)
 if (argsLen === 1) {
  factory = id
  id = undefined
 }
 else if (argsLen === 2) {
  factory = deps
  // define(deps, factory)
  if (isArray(id)) {
   deps = id
   id = undefined
  }
  // define(id, factory)
  else {
   deps = undefined
  }
 }
 // Parse dependencies according to the module factory code
 if (!isArray(deps) && isFunction(factory)) {
  deps = parseDependencies(())
 }
 ...

If deps is transmitted, then no analysis is performed. If it is transmitted, then source analysis is performed:

var REQUIRE_RE = /"(?:\\"|[^"])*"|'(?:\\'|[^'])*'|\/\*[\S\s]*?\*\/|\/(?:\\\/|[^\/\r\n])+\/(?=[^\/])|\/\/.*|\.\s*require|(?:^|[^$])\brequire\s*\(\s*(["'])(.+?)\1\s*\)/g
var SLASH_RE = /\\\\/g
function parseDependencies(code) {
 var ret = []
 (SLASH_RE, "")
   .replace(REQUIRE_RE, function(m, m1, m2) {
    if (m2) {
     (m2)
    }
   })
 return ret
}

seajs is a regular comparison of source code and searching for require, which means that require is a keyword in the seajs module.

Then the problem is. Generally, the compression tools we use are compressed by variables. Require is not a standard js keyword, so after compression requires, it becomes abcdefg... so naturally it cannot be used.

There are two analysis methods:

1. The official seajs is the seajs standard module construction tool:/seajs/seajs/issues/538Build using spm.

2. Replace the compression tool and use a custom keyword, that is, let the compression tool not compress the require variable.

Currently, the three mainstream compression tools are: YUI Compressor, Google Closure Compiler, and UglifyJS. As far as we know, it seems that the first two do not support custom keywords (?), and UglifyJS supports them. So you can use UglifyJS for compression

UglifyJS  -o  -m -c -r require

The -r option is used to specify that the variable is not compressed.

In general, when using seajs, you should try to use official build tools.

For more information about JavaScript, readers who are interested in reading this site's special topic:JavaScript extension skills summary》、《Summary of JavaScript characters and string operation techniques》、《Summary of JavaScript mathematical operations usage》、《Summary of json operation skills in JavaScript》、《Summary of JavaScript Errors and Debugging Skills"and"Summary of JavaScript data structure and algorithm techniques》

I hope this article will be helpful to everyone's JavaScript programming.