如果不处理包,则在浏览器中显示“找不到模块”

时间:2019-07-31 22:12:21

标签: javascript node.js node-modules browserify uglifyjs

我有一个尝试使用Browserify构建的自定义库。该库使用fabric.js,使用一些自定义类对其进行扩展,并在全局范围内公开以在浏览器和node.js中使用。这是该库的主要入口点:

(function () {
    "use strict";

    // Make fabric global in browsers and node
    this.fabric = require('./libs/fabric.canvasex.js');
    this.fabric.internal_version = "1.0.0";

    require('./libs/BoundedText/BoundedText.js');
    require('./libs/BoundedText/PathText/PathIText.js');
    require('./libs/VectorPlaceholder/fabricVectorPlaceholder.js');
    require('./libs/ImagePlaceholder/fabricImagePlaceholder.js');

}).call(this);

该库的文件结构是这样的:

enter image description here

要将此库构建为单个文件,请使用以下命令:

browserify --full-paths js/main.js | uglifyjs --compress --mangle safari10 > dist/my-lib.js

这很好用,我可以在浏览器中包括它,并在node.js中要求它,它也变成了我需要的全局变量。问题开始于我必须调试某些东西,而缩小的代码显然对此并不理想,因此我将库捆绑成这样:

browserify --full-paths js/main.js > dist/my-lib.js

现在,当我尝试使用browserify将此构建包含在另一个节点程序中时,如下所示:

require('./customily-fabric.js');

将程序与库绑定时出现这些错误:

[1] Error: Cannot find module '../fabric.js' from 'D:\Git-Repos\Customily\CustomilyFabric\dist'
[1] Error: Cannot find module './OpentypeIText.js' from 'D:\Git-Repos\Customily\CustomilyFabric\dist'      
[1] Error: Cannot find module './startsWith-polyfill.js' from 'D:\Git-Repos\Customily\CustomilyFabric\dist'
[1] Error: Cannot find module './Font.js' from 'D:\Git-Repos\Customily\CustomilyFabric\dist'
[1] Error: Cannot find module '../../fabric.js' from 'D:\Git-Repos\Customily\CustomilyFabric\dist'
[1] Error: Cannot find module './ctxtextpath.js' from 'D:\Git-Repos\Customily\CustomilyFabric\dist'        
[1] Error: Cannot find module './path-properties.min.js' from 'D:\Git-Repos\Customily\CustomilyFabric\dist'
[1] Error: Cannot find module '../potrace.js' from 'D:\Git-Repos\Customily\CustomilyFabric\dist'
[1] Error: Cannot find module './fabricMaskFilter.js' from 'D:\Git-Repos\Customily\CustomilyFabric\dist'   
[1] Error: Cannot find module './fabric.js' from 'D:\Git-Repos\Customily\CustomilyFabric\dist'
[1] Error: Cannot find module './libs/BoundedText/BoundedText.js' from 'D:\Git-Repos\Customily\CustomilyFabric\dist'
[1] Error: Cannot find module './libs/BoundedText/PathText/PathIText.js' from 'D:\Git-Repos\Customily\CustomilyFabric\dist'
[1] Error: Cannot find module './libs/VectorPlaceholder/fabricVectorPlaceholder.js' from 'D:\Git-Repos\Customily\CustomilyFabric\dist'
[1] Error: Cannot find module './libs/ImagePlaceholder/fabricImagePlaceholder.js' from 'D:\Git-Repos\Customily\CustomilyFabric\dist'
[1] Error: Cannot find module './libs/fabric.canvasex.js' from 'D:\Git-Repos\Customily\CustomilyFabric\dist'

我发现,如果仅从库构建中删除--mangle选项,则尝试将其包含在另一个节点程序中时会出现这些错误。为什么会这样呢?所有模块都不应该包含在捆绑软件中吗?

1 个答案:

答案 0 :(得分:0)

经过更多搜索之后,我终于找到了原因,当使用browserify时,您无法添加与browserify捆绑在一起的库,请参见this问题。

该功能将在browserify 17中提供,因此,现在,我切换到webpack来构建我的库。

相关问题