0

介绍

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

spectrum-colorpicker2由于现代外观和功能，我的选择停止了。

我正在使用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.
[..]

裹

如果我犯了错误，请纠正我。请就这个问题给我建议。

谢谢！

4

1 回答 1

1

原来下载的包spectrum-colorpicker2格式不正确！

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

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

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

var spectrum = require('spectrum-colorpicker2/dist/spectrum.min.js');
于 2020-04-08T10:47:48.850 回答