Webpack Encore找不到已安装的依赖关系Spectrum-colorpicker2

Question

简介

我想在项目中使用颜色选择器。

由于外观和功能新颖，我的选择在spectrum-colorpicker2上停止了。

• Documentation site;
• Code on github;
• YarnPKG package。

我正在将Symfony v4.4与Webpack Encore捆绑包一起使用。

对于JS软件包，我使用YarnPKG。

问题

import和require都导致相同的错误。

错误

[..]
PS D:\DEV\project> yarn encore dev
yarn run v1.22.4
$ D:\DEV\project\node_modules\.bin\encore dev
Running webpack ...

 ERROR  Failed to compile with 1 errors

This dependency was not found:

* spectrum-colorpicker2 in ./assets/js/file_type_color.js

To install it, you can run: npm install --save spectrum-colorpicker2
[..]

代码1

'use strict';

// loads the jquery package from node_modules
import $ from 'jquery';
var spectrum = require('spectrum-colorpicker2');
require('spectrum-colorpicker2/dist/spectrum.min.css');

$(function()
{
    $('#assign_color').spectrum({
        type: "component",
        showAlpha: "false"
    });
});

代码2

'use strict';

// loads the jquery package from node_modules
import $ from 'jquery';
import spectrum from 'spectrum-colorpicker2';
import 'spectrum-colorpicker2/dist/spectrum.min.css';

$(function()
{
    $('#assign_color').spectrum({
        type: "component",
        showAlpha: "false"
    });
});

我尝试了

我尝试了多次添加和删除程序包，但是结果是相同的。

yarn add spectrum-colorpicker2
yarn remove spectrum-colorpicker2

安装日志

[..]
PS D:\DEV\project> yarn add spectrum-colorpicker2
yarn add v1.22.4
[1/4] Resolving packages...
warning Resolution field "node-notifier@6.0.0" is incompatible with requested version "node-notifier@^5.1.2"
[2/4] Fetching packages...
info fsevents@1.2.11: The platform "win32" is incompatible with this module.
info "fsevents@1.2.11" is an optional dependency and failed compatibility check. Excluding it from installation.
[3/4] Linking dependencies...
warning " > sass-loader@7.3.1" has unmet peer dependency "webpack@^3.0.0 || ^4.0.0".
[4/4] Building fresh packages...
success Saved 1 new dependency.
info Direct dependencies
└─ spectrum-colorpicker2@2.0.0
info All dependencies
└─ spectrum-colorpicker2@2.0.0
Done in 5.22s.
[..]

包装

如果我出错了，请纠正我。 请就这个问题向我提出建议。

谢谢！

Answer 1

事实证明，下载的软件包spectrum-colorpicker2的格式不正确！

在另一个dist文件夹中有dist文件夹。

结果Webpack找不到所需的文件。

解决方案是：直接包含JavaScript文件：

var spectrum = require('spectrum-colorpicker2/dist/spectrum.min.js');