如何使用browserify在npm上安装库？

I've been working with angular and using bower as a package manager. For a current project I want to use some npm modules in the browser and started with browserify

我一直在使用角度和使用凉亭作为包管理器。对于当前项目，我想在浏览器中使用一些npm模块，并从browserify开始

For my starter project I was able to npm install angular angular-ui-router --save because they have npm packages but I'm used to installing dependencies with bower install

对于我的初学者项目我能够npm安装角度angular-ui-router --save，因为他们有npm包但我习惯用bower安装来安装依赖项

Building my browserify-angular app, how do I install dependencies that aren't listed on npm? Essentially does browserify have a replacement to bower install, or could I use bower with browserify?

构建我的browserify-angular应用程序，如何安装未在npm上列出的依赖项？从根本上说，browserify可以替代bower安装，或者我可以使用bower来进行浏览器化吗？

For the current project I have a package.json looking like so:

对于当前项目，我有一个package.json看起来像这样：

{
  "name": "browserify-begin",
  "version": "0.0.0",
  "dependencies": {
    "7digital-api": "^0.15.2",
    "angular": "^1.2.16",
    "angular-ui-router": "^0.2.10"
  },
  "devDependencies": {
    "browserify": "^4.1.5",
    "grunt": "^0.4.5",
    "grunt-browserify": "^2.1.0",
    "grunt-contrib-connect": "^0.7.1",
    "grunt-contrib-copy": "^0.5.0"
  }
}

2 个解决方案

#1

You can install git-repos with npm without them being published to npm.

您可以使用npm安装git-repos而不将它们发布到npm。

"dependencies": {
    "package": "git+https://github.com/path/to/repo#commitSHAhash"
}

#2

You can try to install via debowerify

您可以尝试通过debowerify进行安装

The package.json may then look as follows:

然后package.json可能如下所示：

{
  "name": "browserify-begin",
  "version": "0.0.0",
  "dependencies": {
    "7digital-api": "^0.15.2",
    "angular": "^1.2.16",
    "angular-ui-router": "^0.2.10"
  },
  "browserify": {
    "transform": [
      "debowerify"
    ]
  },
  "devDependencies": {
    "browserify": "^4.1.5",
    "debowerify": "^0.7.1",
    "grunt": "^0.4.5",
    "grunt-browserify": "^2.1.0",
    "grunt-contrib-connect": "^0.7.1",
    "grunt-contrib-copy": "^0.5.0"
  }
}

Updates on 24-May-2014

Given the source javascript file is source.js And you want to browserified to build.js

鉴于源javascript文件是source.js并且您想要浏览化为build.js

Using debowerify, if your source.js contains bower components like bootstrap etc, for example:

使用debowerify，如果你的source.js包含像bootstrap等的bower组件，例如：

require('bootstrap')

The Gruntfile.js will look like the following:

Gruntfile.js将如下所示：

module.exports = function(grunt) {

  // Project configuration.
  grunt.initConfig({
    // Metadata.
    pkg: grunt.file.readJSON('package.json'),
    browserify: {
      bundleOptions: {
        debug: true
      },
      js: {
        src:['source.js'],
        dest: 'build.js'
      }
    }
  }),

  grunt.loadNpmTasks('grunt-browserify');    
}

build.js will include bootstrap component

build.js将包含bootstrap组件