在webpack构建期间,未将Favicon添加到构建文件夹

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了在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'
  }

以上是关于在webpack构建期间,未将Favicon添加到构建文件夹的主要内容,如果未能解决你的问题,请参考以下文章

Sagemaker 在训练期间未将 Tensorboard 日志输出到 S3

Favicon 不会显示,似乎是 webpack 的问题

如何将 favicon 添加到 Next.js 静态站点?

Visual Studio 2019 未将引用的项目添加到 deps.json

未将对象引用设置到对象的实例

Vue.cli 修改 webpack 以在构建期间不嵌入 json 文件?