当前位置:  开发笔记 > 编程语言 > 正文

在使用browserify或webpack捆绑后访问"公共"成员

如何解决《在使用browserify或webpack捆绑后访问"公共"成员》经验,为你挑选了1个好方法。

我有一个test.js脚本,它定义一个类,App并从HTML文件加载,所有工作.

当我使用browserify或webpack 创建一个testBundle.jsbundle时test.js,App里面的类testBundle.js似乎没有更多定义.

我应该如何编写代码或者我应该给browserify提供哪些选项以获取App定义并像以前一样从HTML中使用它,但是从捆绑包中?

捆绑后我得到的错误是:

Uncaught ReferenceError: App is not defined

html文件如下:


   

   

test.js:

'use strict';

class App {
    constructor() {
        console.log("App ctor")
    }
}

构建捆绑包的命令:

browserify -t [ babelify --presets [ es2015 ] ] test.js  -o testBundle.js 

在我看来,在包内看,App实际上是私有的.

testBundle.js

(function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o

所有这些都使用来自浏览器的Javascript,ES6.



1> fvgs..:

您正尝试App在全局范围内访问.但是,App默认情况下,全局不可用.Node.js使用模块,Browserify尊重封装模块提供的.使用Browserify或Webpack等工具时,最常见的是有一个或多个入口点模块(即文件)使用模块导入/ require()来访问其他模块.

但是,如果您希望能够App在浏览器中的全局上下文中进行访问,则可以将该App类的引用分配给windowtest.js中的属性:

例如

window.App = App;

要么

Object.assign(window, { App });

推荐阅读
依然-狠幸福
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有