reactjs - 在 webpack 构建期间未将 Favicon 添加到构建文件夹
问题描述
我正在尝试将图像放入我的 dist 文件夹,但它没有显示出来。
我已经包含了我认为可以使它工作的 copy-webpack-plugin。我在构建过程中确实收到一条警告消息,上面写着:'警告无法在'/Users/developer/Desktop/RecruitsPro/client/public'中找到'/Users/developer/Desktop/RecruitsPro/client/public'
webpack.config.js
var webpack = require('webpack');
var path = require('path');
var HtmlWebpackPlugin = require('html-webpack-plugin');
var CopyWebpackPlugin = require('copy-webpack-plugin');
const helpers = require('./helpers');
const VENDOR_LIBS = [
'axios',
'ordinal',
'react',
'react-activity',
'react-avatar',
'react-dom',
'react-easy-chart',
'react-is',
'react-modal',
'react-redux',
'react-router-dom',
'react-stripe-checkout',
'react-window-size',
'redux',
'redux-form',
'redux-thunk'
];
module.exports = {
entry: {
bundle: './client/app/index.js',
vendor: VENDOR_LIBS
},
output: {
path: path.join(__dirname, 'dist'),
filename: '[name].[chunkhash].js'
},
module: {
rules: [
{
use: 'babel-loader',
test: /\.js$/,
exclude: /node_modules/
},
{
use: ['style-loader', 'css-loader'],
test: /\.css$/
}
]
},
plugins: [
new HtmlWebpackPlugin({
template: './client/public/index.html'
}),
new webpack.DefinePlugin({
'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV)
}),
new CopyWebpackPlugin([{
from: helpers.root('client/public')
}])
]
};
helpers.js
const path = require('path');
// Helper functions
function root(args) {
args = Array.prototype.slice.call(arguments, 0);
return path.join.apply(path, [__dirname].concat('../', ...args));
}
exports.root = root;
我期待这张照片会出现。
解决方案
对于任何好奇的人,我必须将此代码添加到我的 module.rules 数组中。
{
test: /\.png$/,
loader: 'file-loader'
}
推荐阅读
- r - R 插入 1 个额外的 obs。和 1 个额外的变量。读取 csv 时
- python - 如何使用多线程在 tkinter 应用程序中播放/暂停 BG 音乐?
- sql - 表自连接
- flutter - 打开通知面板时自定义声音停止
- bash - bash:将关联数组作为参数传递给另一个脚本
- biztalk - 在 BizTalk 解决方案中将“状态”(例如日期)保存在哪里?
- python - Python 2.6.9 上与代理的 Https 连接
- scala - 将 2019 年 7 月 7 日星期二 12:30:42 转换为时间戳 scala /spark
- node.js - Node.js - XML 验证
- java - 简单的控制台程序,但我需要 GoF 模式来进行搜索算法