2014-05-16 66 views
29

我使用的軟件包不可用出NPM框的方式,現在的問題是這樣的:Browserify和涼亭。典型的做法

的package.json有:

"napa": { 
    "angular": "angular/bower-angular", 
    "angular-animate": "angular/bower-angular-animate", 
    "d3": "mbostock/d3", 
    "ui-router":"angular-ui/ui-router", 
    "bootstrap":"twbs/bootstrap" 
    }, 
    "scripts": { 
    "install": "node node_modules/napa/bin/napa" 

和安裝文件到node_modules目錄和我本身使用它們像這樣

require('angular/angular') 
require('ui-router') 
... etc 

這一工程,但我在想,如果有可能使用與鮑爾已安裝的軟件包(進入涼亭特定的文件夾)和本機使用它們作爲節點模塊?是否可以調整節點的模塊分辨率,並強制它不僅在node_modules目錄內尋找模塊,而且還在bower目錄中尋找模塊?或者可能使用npm link或其他?

是否有某種使用browseowery和bower的約定?

+0

你爲什麼要在服務器上使用角度?或者那些要求出現在瀏覽器中? –

+0

非常insighfull –

回答

23

您可以使用browserify-shim並在package.json這樣的配置涼亭安裝的模塊:

"browser": { 
    "angular": "./bower_components/angular/angular.js", 
    "angular-resource": "./bower_components/angular-resource/angular-resource.js" 
}, 
"browserify-shim": { 
    "angular": { 
    "exports": "angular" 
    }, 
    "angular-resource": { 
    "depends": ["./bower_components/angular/angular.js:angular"] 
    } 
}, 

然後你的代碼可以通過其短名稱require他們,如果有正規NPM模塊。

Here is the spec for the "browser" package.json property

+2

似乎只是設置「瀏覽器」部分作品中的所有內容(即使沒有安裝browserify-shim)...現在的問題是:browserify支持瀏覽器部分的通配符嗎?我們可以這樣做:「瀏覽器」:{「*」:「./ bower_components /」}。或者每一個包都必須明確列出? – Agzam

+0

通配符支持對我來說似乎不太可能,但試試吧。 –

41

您可以嘗試通過debowerify

安裝的package.json看起來可能是如下:

{ 
    "name": "browserify-begin", 
    "version": "0.0.0", 
    "dependencies": { 
    }, 
    "browserify": { 
    "transform": [ 
     "debowerify" 
    ] 
    }, 
    "devDependencies": { 
    "browserify": "^4.1.5", 
    "debowerify": "^0.7.1", 
    "grunt": "^0.4.5" 
    } 
} 

定角度安裝有

bower install angular 

然後js文件內會如下:

require("angular"); 
+9

好悲傷,它只是工作。 –