require方法在js编译后被注释

js中的 require('./jquery.gritter.js')($); 后面的($)是什么意思~

　　jquery是由javascript开发的一个框架,并不是一种独立的语言,这种框架其实就是javascript的一个函数,函数名就为jquery,由于在框架中把jquery简写成了一个简单的$符号所以这个函数的使用格式就变成了$(),自然使用jquey就得加$()或jquery();

说明你的require用的不对~导致没有加载成功JS，或者依赖关系没写对，需要的JS没加载导致JS没运行~

RequireJS Optimizer 对脚本的优化支持目前流行的 UglifyJS 和 Closure Compiler 两种压缩方式，UglifyJS 需要 NodeJS 环境支持，而 Closure Compiler 则需要 Java 环境。这篇文章是以运行于 NodeJS 的 UglifyJS 来优化的，这也是 RequireJS Optimizer 默认的压缩方法。

首先需要安装 Node 0.4.0，然后下载 r.js ，下载好以后就可以在命令行里对前端代码进行优化了。r.js的参数传递使用方式，一是直接加在命令行后面，如下：

node r.js -o baseUrl=. paths.jquery=some/other/jquery name=main out=main-built.js

二是新建一个配置文件，例如 build.js（推荐使用这种方式），这样配置更方便，如下：

node r.js -o build.js

build.js 的配置代码如下：

{    baseUrl: "../js",    dir: "../dist",    optimize: "uglify",    optimizeCss: "standard.keepLines",    mainConfigFile: "../js/main.js",    removeCombined: true,    fileExclusionRegExp: /^\./,    modules: [
{            name: "app/dispatcher",
},
{            name: "app/in-storage",            exclude: [                "jquery",                "app/common",                "pkg/DatePicker/app"
]
}
]
}

基本参数介绍

• appDir

  应用程序的最顶层目录。可选的，如果设置了的话，r.js会认为脚本在这个路径的子目录中，应用程序的文件都会被拷贝到输出目录（dir 定义的路径）。如果不设置，则使用下面的 baseUrl 路径。

• baseUrl

默认情况下，所有的模块都是相对于这个路径的。如果没有设置，则模块的加载是相对于 build 文件所在的目录。另外，如果设置了appDir，那么 baseUrl 应该定义为相对于 appDir 的路径。

• dir

  输出目录的路径。如果不设置，则默认为和 build 文件同级的 build 目录。

• optimize

  JavaScript 代码优化方式。可设置的值：

  -   "uglify：使用 UglifyJS 压缩代码，默认值；-   "uglify2"：使用 2.1.2+ 版本进行压缩；-   "closure"： 使用 Google's Closure Compiler 进行压缩合并，需要 Java 环境；-   "closure.keepLines"：使用 Closure Compiler 进行压缩合并并保留换行；-   "none"：不做压缩合并；
  

• optimizeCss

  CSS 代码优化方式，可选的值有：

  -   "standard"：标准的压缩方式；
  -   "standard.keepLines"：保留换行；
  -   "standard.keepComments"：保留注释；
  -   "standard.keepComments.keepLines"：保留换行；
  -   "none"：不压缩；
  

• mainConfigFile

  如果不想重复定义的话，可以使用这个参数配置 RequireJS 的配置文件路径。

• removeCombined

  删除之前压缩合并的文件，默认值 false。

• fileExclusionRegExp

  要排除的文件的正则匹配的表达式。

• modules

  定义要被优化的模块数组。每一项是模块优化的配置，常用的几个参数如下：

  - `name：`模块名；- `include：`额外引入的模块，`create：`如果不存在，是否创建。默认`false`；- `exclude：`要排除的模块。有些模块有公共的依赖模块，在合并的时候每个都会压缩进去，例如一些基础库。使用 exclude 就可以把这些模块在压缩在一个更早之前加载的模块中，其它模块不用重复引入。
  

其它事项

RequireJS 配置也可以放到 RequireJS Optimizer 配置文件里面，例如：

• {    baseUrl: "../js",    dir: "../dist",    optimize: "uglify",    optimizeCss: "standard.keepLines",    removeCombined: true,    fileExclusionRegExp: /^\./,    modules: [


•        {            name: "app/dispatcher",


•        },


•        {            name: "app/in-storage",            exclude: [                "jquery",                "app/common",                "pkg/DatePicker/app"


•            ]


•        }


•    ],    paths: {        jquery: 'lib/jquery',        underscore: 'lib/underscore',        backbone: 'lib/backbone/backbone',        backboneLocalstorage: 'lib/backbone/backbone.localStorage',        text: 'lib/require/text'


•    },    shim: {        underscore: {            exports: '_'


•        },        backbone: {            deps: [                'underscore',                'jquery'


•            ],            exports: 'Backbone'


•        },        backboneLocalstorage: {            deps: ['backbone'],            exports: 'Store'


•        }


•    }


• }



RequireJS Optimizer 的配置参数还有很多，完整的参数介绍可以看这里：

example.build.js

为方便运行，可以新建一个批处理文件：

• @echo off



• echo build...


• e:


• cd E:\SCM\SRC\scm-html
  ew-scm-htmlools



• node r.js -o build.js



• echo Press any key to exit!


• echo. & pause



注意事项：RequireJS Optimizer 只支持使用 require 和 define 语法定义的模块，因此下面这种通过变量定义的方式是不支持的：

• var mods = someCondition ? ['a', 'b'] : ['c', 'd'];require(mods);



而如果是这样定义则可以：

• require(['a', 'b']);



或者：

• define(['a', 'b'], function (a, b) {});



进一步优化

使用 r.js 优化后的代码可以使用 almond   来加载。almond 是一个轻量的 AMD 加载器，提供了最基础的 AMD API 实现以及模块加载功能。almond 只有不到 400 行代码，要比 RequireJS 小很多。可以使用 r.js 把 almond 一起合并到业务代码的前面，如下：

• (function () {    //almond will be here


•    //main and its nested dependencies will be here}());



almond 特别适合使用 AMD 的网站或应用，但也有一些限制：

• 所有的模块编译为一个文件，没有动态的加载；

• 所有的模块都需要在 define() 定义 ID 和依赖，这个 RequireJS Optimizer 会处理；

• 只能有一个 requirejs.config() 或者 require.config() 调用；

• 不能使用 Require JS 多版本功能；

• 不能使用 require.toUrl() 或者 require.nameToUrl()；

• 不能使用 packages/packagePaths 配置。

如果你的项目中没有这些问题的话，可以放心使用 almond 进行加载。

---

鄂州市14756507440： 关于javascript里require的问题 - ？
移味枸橼： 这是因为你的fs模块还没加载好.异步加载模块的时候,尤其是你在使用require加载多个模块的时候, 要在前面模块加载完成后,调用回调函数,调用第2个模块,然后再回调,调用第3个模块... 这样就不会报错了.

鄂州市14756507440： commonjs规范的require一个变量为什么报错 - ？
移味枸橼： : require(arg,function(obj))第一个参数是路径数组,然后在function中将这个js当参数引用进来,这样在function中就可以使用了

鄂州市14756507440： 为什么 require loop or previous error loading module - ？
移味枸橼： 在项目中使用了 requirejs 来按需加载脚本. requirejs 中定义了 require 方法,但是呢,引用的第三方类库中也有调用require 方法,于是就报错了: require.js:168 Uncaught Error: Mismatched anonymous define() module: function (__WEBPACK_EXTERNAL_MODULE_1__) { …… }

鄂州市14756507440： Mismatched anonymous define() module:这个怎么解决requirejs中的 - ？
移味枸橼： 引用的requirejs跟引用的其他js引起了冲突,其他js中也定义的define这个变量. 比如你引用了这样的js:<script src=＂services/require.js＂></script> <script src=＂services/Utility.js＂></script> 出现了Mismatched anonymous define() module这种...

鄂州市14756507440： webpack中require和import的区别 - ？
移味枸橼： commonjs同步语法 经典的commonjs同步语法如下:var a = require('./a'); a.show(); 此时webpack会将a.js打包进引用它的文件中.这是最普遍的情形,不必赘述.commonjs异步加载 在commonjs中有一个Modules/Async/A规范,里面定义了...

鄂州市14756507440： 如何在一个js中引用多个js文件 - ？
移味枸橼： 可以创建一个函数叫require 该函数支持两个参数 第一个参数 src 需要引入的script的路径 (这个参数可以是路径也可以是一个数组 多个js文件) 第二个回掉函数 在引入的script标签加载完成了调用 因为楼主是引用js文件所以必须要在引入的js加...

鄂州市14756507440： 使用requirejs模块化引入 js,不知道为什么还是报错,就如图所示 - ？
移味枸橼： 我直接使用esl没有问题的...require.config({ paths: { 'echarts': './echarts2/echarts-original', 'echarts/chart/bar': './echarts2/echarts-original', 'echarts/chart/line': './echarts2/echarts-original', 'echarts/chart/pie': './echarts2/echarts-original', 'echarts/...

鄂州市14756507440： 前端 require js 使用问题 - ？
移味枸橼： 很明显只能是 在底部代码执行前载入依赖文件.可以考虑将底部代码也用require加载,并放在依赖文件之后,并放在 window.onload=function(){ 这里 }

鄂州市14756507440： nodejs 插件都已安装好 hbuilder运行报错 - ？
移味枸橼： 在终端上运行mysqltest.js,它运行是脚本.它跟浏览器运行是不同的执行环境.虽然在运行在V8引擎(假设你用Chrome)上,执行环境和可用的库是不同的.Node.js中,require()是一个功能,它被添加执行环境.当你在终端运行JS文件,在执行文件环境是包含require()的.require()不是内置浏览器的功能.是Node.js特定的功能,所以你试图在浏览器上运行你的脚本(JS文件)时,将会得到”Uncaught ReferenceError: require is not defined”错误.

鄂州市14756507440： requirejs 中 require和 require有什么区别 - ？
移味枸橼： 首先无论require还是import,都不是webpack的发明,它们是已经存在于世的不同的模块化规范(目前都不能直接运行于浏览器). 于是需要通过webpack在配合各种plugin、loader将其转义