无法在webpack的节点模块内加载javascript类

时间:2019-06-25 17:57:40

标签: javascript npm webpack

我已经创建并发布了一个自定义的npm软件包,并将该软件包包含在我的webapck入口文件中。但是我无法在html文件中的npm类内调用函数。这是我的npm软件包

FROM php:7.2.19-apache-stretch

# Configure Apache server
COPY config_apache/sites-available /etc/apache2/sites-available

# Create symlink in sites-enabled
WORKDIR /etc/apache2/sites-enabled
RUN ln -s /etc/apache2/sites-available/app.conf app.conf

RUN mkdir -p /var/www/vhosts/app/logs

COPY /build_files/install_composer_dependencies.sh /usr/local/bin/apache2_install_composer_dependencies.sh

RUN apt-get update -y && apt-get install -y  curl nano libapache2-mod-geoip git zip unzip mysql-client

# Install Composer
RUN curl -o /tmp/composer-setup.php https://getcomposer.org/installer \
&& curl -o /tmp/composer-setup.sig https://composer.github.io/installer.sig \
# Verify installer
&& php -r "if (hash('SHA384', file_get_contents('/tmp/composer-setup.php')) !== trim(file_get_contents('/tmp/composer-setup.sig'))) { unlink('/tmp/composer-setup.php'); echo 'Invalid installer' . PHP_EOL; exit(1); }" \
&& php /tmp/composer-setup.php --no-ansi --install-dir=/usr/local/bin --filename=composer --snapshot \
&& rm -f /tmp/composer-setup.*

RUN a2enmod rewrite
RUN a2enmod geoip
RUN service apache2 restart

我已经将其包含在我的webpack条目文件中

 export default class myClass{
        constructor(getVar){
            this.params     =   {
                signLength : (getVar.signLength !=undefined)?getVar.signLength:null,
                canvas     : (getVar.canvas !=undefined)?getVar.canvas:null,
                linecolor  : (getVar.linecolor !=undefined)?getVar.linecolor:null,
                pointSize  : (getVar.pointSize !=undefined)?getVar.pointSize:null,
                xstarting  : '',
                ystarting  : ''
            }; 
...........................

我正试图在我的html文件中调用它

const myClass = require('npm pack name').default;
module.exports = myClass;

但我收到此错误

  

index.html:24未捕获的ReferenceError:未定义myClass

1 个答案:

答案 0 :(得分:1)

您无法将myClass访问到html文件中,因为它是封装的而不是全局变量。

要解决此问题,您应该使用js文件并将myclass导入到该文件中。

const myClass = require('path_to_my_class');
setParams.canvas.addEventListener("mousemove", function(e){
    myClass.draw(e);
  },false);

或者,如果您想真正访问html的myclass,则需要使用一个不建议使用但应该起作用的全局变量。

window.myclass = require('npm pack name').default;

注意: require().default是一个构造函数,也许您需要关键字new来实例化它。