Webpack禁用输出上图像名称的哈希

Webpack禁用输出上图像名称的哈希

本文介绍了Webpack禁用输出上图像名称的哈希的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

构建我的angular4应用程序后,webpack将我的图像名称从bg_node_new.png更改为bg_node_new.3746bc3ac9b1bf77d2aff2c2df901a48.png.

After building my angular4 application, webpack changed my image name from bg_node_new.png to bg_node_new.3746bc3ac9b1bf77d2aff2c2df901a48.png.

我的webpack.config代码是:

my webpack.config code is:

(function(module) {

    const path = require('path');
    const npm_cmd = process.env.npm_lifecycle_event;
    const p = !(require('yargs').argv.p || false);
    let config;

    module.exports = function(env) {

        let cmds = npm_cmd.split(":");
        const cmd = cmds.length >= 2 ? cmds[1] : null;
        const mod = cmds.length >= 3 ? cmds[2] : null;
        const aot = cmds.length >= 4 ? cmds[3] : null;

        const options = {
            p:!p,
            mod:mod,
            aot:aot,
            env:env,
            ngv:2,
            ctx:path.resolve(__dirname, "../../../../..")
        }
        //console.log(options);

        switch (cmd) {
          case 'app':
            console.log("Building app");
            config = require('./wp.app')(options);
            break;
          case 'lib':
            console.log("Building lib");
            config = require('./wp.lib')(options);
            break;
          case 'mod':
            console.log("Building mod");
            config = require('./wp.mod')(options);
            break
          default:
            console.log("Building app");
            config = require('./wp.app')(options);
            break;
        }

        return config;
    }

})(module);

由于这个原因,该图像未在我的应用程序中呈现.如何解决这个问题?

Due to this, the image is not rendering in my app. how to resolve this issue?

预先感谢!

推荐答案

已更新OP评论后:

在您的wp.base.js中,从以下项中删除[hash]:

In your wp.base.js, remove [hash] from the following:

const raw_file_loader = {
    test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico|otf)$/,
    use: 'file-loader?name=assets/[name].[ext]'
}


原始答案:

如果您共享Webpack配置,我将竭诚为您解答.但是,在您的webpack.config

If you share your webpack config, I'll be ablr to answer better. However, Find a config like this in your webpack.config,

{
  test: /.*\.(gif|png|jpe?g|svg)$/i,
  use: [
    {
      loader: 'file-loader',
      options: {
        name: '/images/[name]_[hash:7].[ext]',
      }
    },
  ]
}

...并删除[hash]部分.像这样保持它:

... and remove the [hash] part. Just keep it like this:

这篇关于Webpack禁用输出上图像名称的哈希的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

08-13 12:48