浏览器在尝试捆绑许多 js 文件时找不到模块

Question

这是我第一天做node，我在尝试捆绑一些js文件时遇到了一些问题。

MyFolder
|-- app (folder)   
|  |-- Collections (contains: movies.js)   
|  |-- Models (contains: movie.js)  
|  |-- node_modules  
|-- main.js  
|-- node_modules (folder)    
|-- static (folder)  

这是我想压缩成静态/捆绑.js的js文件的内容。

 // app/models/movie.js  
 var Backbone = require("backbone");
 var Movie = Backbone.Model.extend({
   defaults: {
     title: "default",
     year: 0,
     description: "empty",
     selected: false
   }
 });
 module.exports = Movie;
 // app/collections/movies.js  
 var Backbone = require("backbone");
 var Movie = require('models/movie');
 var Movies = Backbone.Collection.extend({
      model: Movie
 });
 module.exports = Movies;

当我运行browserify -r ./app/main:app > static/bundle.js文件包时.js是使用 app/main.js 中的脚本创建的。它按预期工作。

但是当我运行 browserify -r ./app/collections/movies.js:movies -r ./app/models/movie.js:movie > static/bundle.js 时，它会创建一个空捆绑包.js并显示以下内容：

Error: Cannot find module '/Users/MyFolder/app/models/movie.js:movie' from '/Users/MyFolder'  

我的文件夹app/node_modules与ln -sf ../models .同步，ln -sf ../collections .

问题1：任何提示我做错了什么？
问题2：如果static/bundle.js存在。再次运行浏览器化是否会覆盖文件？在我的本地测试中，它不会覆盖，所以我应该每次都删除此文件进行更新吗？

Answer 1

可以考虑将./添加到您的路径中：

var Movie = require('./models/movie');

请参阅： 如何使用浏览器化捆绑骨干应用程序？

Answer 2

对于来自搜索引擎的人：

可能是您使用的是Mac，并且在需要文件时没有使用正确的大小写。

这在 mac 中是等效的：

require('./someFile');
require('./somefile'); 

但不是在 centOs 中。

Answer 3

如果使用调试器并单步执行require调用，您会发现自己处于一些缩小的代码中（通常）。

(function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require== ...

转到主机并检查t[o][1]

这将向您显示模块的正确路径列表。

Object {
    '<module name>' : <id>
    ...
}

如果这变得太混乱，请暂时取消缩小已编译bundle.js文件中的第一行（我在 PhpStorm 中使用 alt-cmd-l），然后重试。

Answer 4

我遇到了同样的错误。就我而言，这是因为如果文件未在要求中直接指定，则 Browserify 不会检测到该文件。

例：

改变：

var f = 'filename'
var handler = require('./' + f + '.js'); --> this will generate an error

自：

var handler = require('./filename.js');

Answer 5

我最近遇到了同样的错误。我正在使用 Gulp 4 运行 Browserify。

问题是我正在重新组织我的项目文件夹架构，我没有清空捆绑.js文件的目标（dist）文件夹。在我清空该文件夹（在我的情况下它被称为assets）并运行 Browserfy 后，它再次正常工作。

Answer 6

就我而言，我替换了

const router = require(path.join(__dirname, 'router'))

自

const router = require('./router')

让它工作。似乎浏览器不支持通过节点"路径"模块访问本地文件