js模塊編譯

Ⅰ 如何編譯note.js

先cd 到server.js的路徑下 再 note server.js

Ⅱ 如何正確理解javascript的模塊化

模塊化在項目中十分的重要，一個復雜的項目肯定有很多相似的功能模塊，如果每次都需要重新編寫模塊肯定既費時又耗力。但是引用別人編寫模塊的前提是要有統一的「打開姿勢」，如果每個人有各自的寫法，那麼肯定會亂套，下面介紹幾種JS的模塊化的規范。
一:模塊化進程一：script標簽
這是最原始的 JavaScript 文件載入方式，如果把每一個文件看做是一個模塊，那麼他們的介面通常是暴露在全局作用域下，也就是定義在 window 對象中，不同模塊的介面調用都是一個作用域中，一些復雜的框架，會使用命名空間的概念來組織這些模塊的介面。
缺點:
1、污染全局作用域
2、開發人員必須主觀解決模塊和代碼庫的依賴關系
3、文件只能按照script標簽的書寫順序進行載入
4、在大型項目中各種資源難以管理，長期積累的問題導致代碼庫混亂不堪
二:模塊化進程二：CommonJS規范
該規范的核心思想是允許模塊通過require方法來同步載入所要依賴的其他模塊，然後通過 exports 或 mole.exports 來導出需要暴露的介面。
require("mole");
require("../file.js");
exports.doStuff = function(){};
mole.exports = someValue;

優點：
1、簡單並容易使用
2、伺服器端模塊便於重用
缺點:
1、同步的模塊載入方式不適合在瀏覽器環境中，同步意味著阻塞載入，瀏覽器資源是非同步載入的
2、不能非阻塞的並行載入多個模塊
mole.exports與exports的區別
1、exports 是指向的 mole.exports 的引用
2、mole.exports 初始值為一個空對象 {}，所以 exports 初始值也是 {}
3、require() 返回的是 mole.exports 而不是 exports
exports示例：
// app.js
var circle = require('./circle');
console.log(circle.area(4));
// circle.js
exports.area = function(r){
return r * r * Math.PI;
}

mole.exports示例：
// app.js
var area = require('./area');
console.log(area(4));
// area.js
mole.exports = function(r){
return r * r * Math.PI;
}

錯誤的情況：
// app.js
var area = require('./area');
console.log(area(4));
// area.js
exports = function(r){
return r * r * Math.PI;
}

其實是對 exports 進行了覆蓋，也就是說 exports 指向了一塊新的內存（內容為一個計算圓面積的函數），也就是說 exports 和 mole.exports 不再指向同一塊內存，也就是說此時 exports 和 mole.exports 毫無聯系，也就是說 mole.exports 指向的那塊內存並沒有做任何改變，仍然為一個空對象{}，也就是說area.js導出了一個空對象，所以我們在 app.js 中調用 area(4) 會報 TypeError: object is not a function 的錯誤。
總結：當我們想讓模塊導出的是一個對象時， exports 和 mole.exports 均可使用（但 exports 也不能重新覆蓋為一個新的對象），而當我們想導出非對象介面時，就必須也只能覆蓋 mole.exports 。
三:模塊化進程三：AMD規范
由於瀏覽器端的模塊不能採用同步的方式載入，會影響後續模塊的載入執行，因此AMD(Asynchronous Mole Definition非同步模塊定義)規范誕生了。
AMD標准中定義了以下兩個API
1、require([mole], callback);
2、define(id, [depends], callback);
require介面用來載入一系列模塊，define介面用來定義並暴露一個模塊。
示例：
define("mole", ["dep1", "dep2"], function(d1, d2){
return someExportedValue;
});
require(["mole", "../file"], function(mole, file){ /* ... */ });

優點：
1、適合在瀏覽器環境中非同步載入模塊
2、可以並行載入多個模塊
缺點：
1、提高了開發成本，代碼的閱讀和書寫比較困難，模塊定義方式的語義不順暢
2、不符合通用的模塊化思維方式，是一種妥協的實現
四:模塊化進程四：CMD規范
CMD(Common Mole Definition)規范和AMD很相似，盡量保持簡單，並與CommonJS和Node.js的 Moles 規范保持了很大的兼容性。在CMD規范中，一個模塊就是一個文件。
示例：
define(function(require, exports, mole){
var $ = require('jquery');
var Spinning = require('./spinning');
exports.doSomething = ...
mole.exports = ...
})

優點：
1、依賴就近，延遲執行
2、可以很容易在 Node.js 中運行
缺點：
1、依賴 SPM 打包，模塊的載入邏輯偏重
AMD和CMD的區別
AMD和CMD起來很相似，但是還是有一些細微的差別，讓我們來看一下他們的區別在哪裡：
1、對於依賴的模塊，AMD是提前執行，CMD是延遲執行。
2、AMD推崇依賴前置；CMD推崇依賴就近，只有在用到某個模塊的時候再去require。看代碼：
// AMD
define(['./a', './b'], function(a, b){ // 依賴必須一開始就寫好
a.doSomething()
// 此處略去 100 行
b.doSomething()
...
});
// CMD
define(function(require, exports, mole){
var a = require('./a')
a.doSomething()
// 此處略去 100 行
var b = require('./b')
// 依賴可以就近書寫
b.doSomething()
// ...
});

3、AMD 的 API 默認是一個當多個用，CMD 的 API 嚴格區分，推崇職責單一。
五:模塊化進程五：ES6模塊化
EcmaScript6標准增加了JavaScript語言層面的模塊體系定義。ES6 模塊的設計思想，是盡量的靜態化，使得編譯時就能確定模塊的依賴關系，以及輸入和輸出的變數。CommonJS和AMD模塊，都只能在運行時確定這些東西。
在 ES6 中，我們使用export關鍵字來導出模塊，使用import關鍵字引用模塊。需要說明的是，ES6的這套標准和目前的標准沒有直接關系，目前也很少有JS引擎能直接支持。因此Babel的做法實際上是將不被支持的import翻譯成目前已被支持的require。
盡管目前使用import和require的區別不大(本質上是一回事)，但依然強烈推薦使用import關鍵字，因為一旦JS引擎能夠解析ES6的import關鍵字，整個實現方式就會和目前發生比較大的變化。如果目前就開始使用import關鍵字，將來代碼的改動會非常小。
示例：
import "jquery";
export functiondoStuff(){}
mole "localMole" {}

優點：
1、容易進行靜態分析
2、面向未來的 EcmaScript 標准
缺點：
1、原生瀏覽器端還沒有實現該標准
2、全新的命令字，新版的 Node.js才支持

Ⅲ 如何編譯nodejs的二進制模塊

god Buffer類是一個全局的直接處理二進制數據類型。它可以以各種方式構造。 look
sex 純Javascript對於Unicode的處理是友好的，而對二進制並不友好。但處理TCP數據流和文件系統，必須要處理位元組流，所以node.js提供一套策略來創建和操作位元組流。 sex
googog 數據儲存在一個Buffer實例中，一個Buffer的大小是固定的，類似於不可變的整數數組。 good
look Buffer與字元串之間的轉換需要指定明確的編碼。 googog
this Buffer支持的編碼： book
yellow 'ascii'編碼，只為7位的ASCII的數據。這個編碼方法非常快！ googog
god 'utf8' 編碼，支持Unicode字元。 yellow
yellow 'utf16le' 編碼，小端編碼的Unicode字元。對（u10000 ~ u10FFFF）的支持。 fuck
book 'ucs2' 是 'utf16le' 編碼的別名。 god
look 'base64' 是 Base64字元串編碼。 this
good 'hex' 表示十六進制編碼，每個byte編碼為兩個十六進制字元。 look
sex 一個Buffer對象也可以使用一個類型數組。Buffer對象克隆到一個ArrayBuffer，用作類型數組存儲支持。node.js提供的Buffer和標准類型化數組是兩套不同的系統，所以Buffer和ArrayBuffer的內存不共享。 sex
sex 注意：雖然V8提供了標准化的類型化數組，但node.js自身定義的Buffer提供了更靈活強大的API，在之後的章節會詳細講解兩者的轉換與使用方法。 good

Ⅳ JS用什麼軟體編譯方便

編譯JS的軟體，我真的是不知道。
編輯JS的軟體聽說有好多，Eclipse不知道算不算。

Ⅳ nodejs內置模塊有哪些

一、Express框架

前面的章節已經介紹過了，可以使用npm來安裝node.js模塊。具體操作請參照以前寫的nodejs概論。

Express是一個nodejs的web開源框架，用於快速的搭建web項目。其主要集成了web的http伺服器的創建、靜態文本管理、伺服器URL地址請求處理、get和post請求處理分發、session處理等功能。

使用方法，在cmd中打開你所想創建web項目的路徑。然後輸入

Express appname

即可創建一個名為appname的web項目。控制台列印結果

在jada文件中是可以使用for循環和if判斷語句的，可以讓你體會類似JSP的<%%>和php的<php></php>在網頁上輸出數據的快感。

三、forever模塊

nodejs作為http伺服器，需要確保服務順利進行，要注意一下兩點：

1.後台服務運行，監控運行日誌，以及http運行日誌；

2.確保項目的正常安全運行，Node.js的啟動命令node，很大程度無法滿足運行需求；

Node.js的forever模塊在第二點就可以起到很大的作用，同時其擁有監控文件更改、自動重啟等功能。

forever模塊的使用方法有兩種：1.在命令行中使用

forever -l forever.log -o out.log -e err.log app.js
-l forever.log -o out.log -e err.log分別指定了forever的運行日誌，腳本流水日誌，腳本運行錯誤日誌，啟動後將在本文件夾下產生out.log、err.log文件。

2.在編碼中require forever模塊使用。

四、Socket.IO模塊

Socket.IO模塊主要功能是將WebSocket協議應用到所有瀏覽器。主要用於實時的長連接多求情項目中。

例如：在線聯網游戲，實時聊天、實時股票查看、二維碼掃描登錄等。

安裝方法仍然是在cmd在中輸入npm install socket.io

如何使用Socket.IO來創建一個項目。

需要分別實現服務端和客戶端的邏輯：

先創建一個服務端的node.js腳本index_server.js

var app = require('http').createServer(handler)//創建伺服器app
, io = require('socket.io').listen(app)//引用socket.io模塊監聽app
, fs = require('fs')//引用文件處理模塊
app.listen(80);//指定app監聽的埠，第二個參數127.0.0.1可省略

function handler (req, res) {
fs.readFile(__dirname + '/index.html', function (err, data) { if (err) {
res.writeHead(500); return res.end('Error loading index.html');
}
res.writeHead(200);
res.end(data);
});
}

io.sockets.on('connection', function (socket) {
socket.emit('news', { hello: 'world' });
socket.on('my other event', function (data) {
console.log(data);
});
});

其中，socket.emit()為Socket發送消息的函數，第一個參數表示發送消息的key值，第二個參數為發送消息的內容，也就是發送的數據。

Socket。on()為Socket接收消息的函數，第一個參數為接收消息的可以值，第二個參數為回調函數，其中回調函數攜帶的參數為接收消息所發送的數據。

接下來web前端如何使用JavaScrit 來連接Socket伺服器。

新建一個index_client.html

<script type="text/javascript" src="socket.js"></script>
<script type="text/javascript"> var socket = io.connect('http://localhost');//創建本地sock連接
socket.on('news',function (data) {//Socket接收news消息時執行回調函數 console.log(data);
socket.emit('my other event',{my:'data'});
});</script>

<script type="text/javascript" src="socket.js"></script>載入已經安裝好的Socket.io的本地JavaScrit文件。
var socket = io.connect('http://localhost');因為埠為80，所有這里可以不埠號
socket.on('news',function (data)｛｝//客戶端接收news消息成功後，發送my other event消息到服務端，發送的消息內容為json對象{my:'data'}

接下來只需要運行服務端的index_server.js文件來啟動socket服務

效果：在瀏覽器輸入http://127.0.0.1按F12調出瀏覽器的控制台console即可看見列印出了一個object對象。

執行完畢後可能會報錯：catnot find mole socket.io，說明你的socket.IO沒有安裝，或已經安裝並配置為全局，但你的安裝路徑並沒有配置到在path中，所有無法引用。
你可以選擇配置path，或者安裝到項目內。這里建議安裝到你的項目目錄下，而不是簡單粗暴的配置為全局。先卸載npm uninstall socket.io 進入指定目錄後安裝node index_server.js

socket.io詳細請參閱 http://cnodejs.org/topic/50a1fcc7637ffa4155b5a264

五、request模塊

request模塊為開發者提供了一種簡單訪問HTTP請求的方法。request還支持HTTPS的訪問方法。

安裝：

npm install requset

request模塊基本上覆蓋了所有的HTTP請求方式如GET，POST，HEAD，DEL等。但其最基本的兩個方法是request.get()和request.post().

get和post的區別

get：

1.使用get向伺服器發出和接收的請求會附在url之後。類似：http://www..com？id=1221&name=5555這個url中傳遞了兩個參數，一個為id，一個為name。

2.get請求不能超過1024個位元組。

post沒有限制，也不會附在url上。

接下來做一個簡單的實例

get實例：

首先新建一個伺服器app_get.js

var http= require("http");
http.createServer(function(req,res){
res.writeHead(200,{'content-Type':'text/plain'});
res.end('Hello world '+req.method);
}).listen(1337,"127.0.0.1");

再建一個發送求情的request_get.js文件

var request=require('request');
request.get("http://127.0.0.1:1337",function(error,response,result){
console.log(result);
});

在CMD中運行app_get.js，運行成功後，再打開一個cmd（之前的cmd不要關閉），執行request_get.js文件。

執行後的結果如下

hello world
GET

可以看出，通過request.get方法訪問

http://127.0.0.1:1337 返回的結果就是res.end（）的參數

post實例：
和上面一樣，先新建伺服器app_post.js

var http= require("http"),
querystring=require('querystring');
http.createServer(function(req,res){ var postData=""; //開始非同步接收客戶端post的數據
req.addListener("data",function (postDataChunk) {
postData += postDataChunk;
}); //非同步post數據接收完畢後執行匿名回調函數
req.addListener("end",function(){ var postStr=JSON.stringify(querystring.parse(postData));
res.writeHead(200,{'content-Type':'text/plain'});
res.end(postStr+' '+req.method);
});
}).listen(1400,"127.0.0.1");

然後再新建一個request_post.js

var request=require("request");
request.post('http://127.0.0.1:1400',{form:{'name':'ermu','book':'node.js'}},function (error,response,result) {
console.log(result);
})

像上面一樣在cmd中執行後顯示的結果如下：

D: odejssrc equest>node request_post.js
{"name":"ermu","book":"node.js"}
POST

request post提交了一個json對象{"name":"ermu","book":"node.js"}而伺服器接通過獲取該POST數據，然後返回客戶端，同時將http請求方式也響應到客戶端。

request post參數可以有兩種傳遞方式。

其中，第一種是將url和form表單的數據作為json參數在request post傳遞。舉例如下：

request.post('url':'http://127.0.0.1:1400',form:{'name':'ermu','book':'node.js'}},function (error,response,result) {
console.log(result);
})

另一種是將url和form作為兩個參數，上面的實例就是使用這種方法。

六、 Formidable模塊

該模塊的目的是為了解決文件上傳。

在原生的node.js模塊中，提供了獲取post數據的方法，但是並沒有直接獲取上傳文件。

Ⅵ js代碼修改後，如何編譯才能生效

js不需要編譯啊，一般沒有更新可能是緩存造成的，使用ctrl+f5強制刷新一下看看

Ⅶ require方法在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: /^./, moles: [
{ 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

  要排除的文件的正則匹配的表達式。

• moles

  定義要被優化的模塊數組。每一項是模塊優化的配置，常用的幾個參數如下：

  - `name：`模塊名；- `include：`額外引入的模塊，`create：`如果不存在，是否創建。默認`false`；- `exclude：`要排除的模塊。有些模塊有公共的依賴模塊，在合並的時候每個都會壓縮進去，例如一些基礎庫。使用 exclude 就可以把這些模塊在壓縮在一個更早之前載入的模塊中，其它模塊不用重復引入。
  

其它事項

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

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


• { 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:SCMSRCscm-html ew-scm-html ools



• 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 進行載入。

Ⅷ js編譯器

DW好像也有提示吧！是最新版本的。。CS4

我的是用的JS庫，JQUERY的一個插件，，帶提示的。。