Question

我目前正在开发一个只使用HTML，CSS和Javascript而没有像jQuery这样的其他框架的项目。我也在使用Webpack / Babel。

我需要能够动态添加JSColor颜色选择器的实例。我目前正在索引页面中使用CDN链接来下载库，但如果有办法将其正确加载到我的条目文件中，我很乐意将它放在项目目录中。

我研究了这个问题，似乎常见的解决方案是在代码末尾包含jscolor.init()。但是，通过CDN链接和索引文件中的一些HTML，我不确定如何访问jsColor对象。

  const colorPicker = document.createElement('button');

  colorPicker.classList.add(`jscolor`);
  colorPicker.classList.add(`{value:'${conditionalHash[currentType].color}'}`);

  currentOption.append(colorPicker);

编辑：我已经尝试下载该库并将其包含在我的项目目录中。我将它导入我的条目文件并尝试使用以下代码实例化它：

import JSColor from "./assets/jscolor";

const jscolorpicker = new JSColor;
console.log(jscolorpicker);

然而，我收到错误：

未捕获的TypeError：_jscolor2.default不是构造函数

编辑＃2：这是我的webpack文件，请求。

module.exports = {


entry: "./entry.js",
  output: {
    filename: "bundle.js"
  },
  module: {
    loaders:[{
      test: /\.css$/,
      loader: 'style!css?sourceMap'
    }, {
      test: /\.js?$/,
      exclude: /(node_modules)/,
      loader: "babel-loader",
      presets: "es2015"
    }, {
      test: /\.(eot|svg|ttf|woff(2)?)(\?v=\d+\.\d+\.\d+)?/,
      loader: 'url'
    }]
  }
};

有没有办法在不使用jQuery的情况下动态重新初始化JSColor？

0 个答案: