Javascript 网页包| jQuery UI=>;未加载图标集的相对图像URL
此错误:Javascript 网页包| jQuery UI=>;未加载图标集的相对图像URL,javascript,jquery-ui,webpack,loader,webpacker,Javascript,Jquery Ui,Webpack,Loader,Webpacker,此错误: ERROR in ./app/javascript/packs/admin.scss Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js): ModuleNotFoundError: Module not found: Error: Can't resolve './images/ui-icons_444444_256x240.png' in '/Users/trip/Sites
ERROR in ./app/javascript/packs/admin.scss
Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js):
ModuleNotFoundError: Module not found: Error: Can't resolve './images/ui-icons_444444_256x240.png' in '/Users/trip/Sites/the_website/app/javascript/packs'
源于jQueryUI中的此代码段
.ui-icon,
.ui-widget-content .ui-icon {
background-image: url("images/ui-icons_444444_256x240.png");
}
现在,我可以通过手动复制并将这些文件的副本移动到我的网页的入口点来解决这个问题我认为问题在于Webpacker没有告诉CSS文件public\u output\u path
在哪里
我的网页包配置:
rules: [{
test: /\.(css|less|scss|sass)$/i,
include: /node_modules/,
exclude: [
/\.module\.(css|less)$/,
/\.(config|variables|overrides)$/
],
use: [
MiniCssExtractPlugin.loader,
{loader: 'css-loader'},
{loader: 'postcss-loader'},
{loader: 'resolve-url-loader'},
{loader: 'less-loader'},
{loader: 'sass-loader', options: {implementation: require('sass')}},
],
},
...
{
test: /\.(jpg|jpeg|png|gif)$/i,
use: [{
loader: 'file-loader',
options: {
name: isProduction ? '[name]-[hash].[ext]' : '[name].[ext]'
},
}],
}, {
...
resolve: {
alias: {
'jquery-ui' : 'jquery-ui-dist/jquery-ui',
然后在这里从Admin.scss调用它:
@import 'jquery-ui/themes/base/all.css';
有人知道我可能做错了什么吗?有什么要调查的吗?所有评论/问题/俳句欢迎:)您使用的是什么版本?如果是
v5
,则。如果这不起作用,你能在回购协议中复制这个问题吗?@AndreiGătej噢,太好了,谢谢。我在网页5.11.0
。所以我至少从这里开始。@AndreiGătej我在这里做了一个极简复制回购。自述文件有复制的步骤。