Webpack配置:从* .js条目/捆绑文件名中删除哈希 [英] webpack configuration: remove hash from *.js entry/bundle files names

问题描述

我正在做一个vue.js应用程序.

I am doing a vue.js app.

构建后，它将生成一个js文件"background.2a548437.js"，而不是我想要的"background.js".

After build it generate a js file "background.2a548437.js" instead of the "background.js" that I want.

我正在通过"vue.config.js"文件进行webpack链配置.

I'm doing the webpack-chain configuration through the "vue.config.js" file.

要进行诊断，我正在读取"$ vue inspect"的结果，但是我看不到应该调整哪个参数来从js文件中删除哈希.

To diagnose, I'm reading the result of "$vue inspect", but I don't see which parameter should I tune to remove the hash from the js files.

我确实看到了类似'img/[name].[hash:8].[ext]'的模式，但是对于js，它是'js/[name] .js'

I do see patterns like 'img/[name].[hash:8].[ext]' but for js it's 'js/[name].js'

您有任何解决方案或潜在客户吗?

Do you have any solutions or leads ?

上下文/原因:

它使用webpack"^ 4.0.0"和webpack链"^ 6.3.1"通过"vue.config.js"对其进行配置.

It uses webpack "^4.0.0" and webpack-chain "^6.3.1" to configure it through the "vue.config.js".

我正在做一个chrome插件，它有一个引用"background.js"的静态manifest.json文件.

I am doing a chrome plugin which has a static manifest.json file referencing "background.js".

我将深入研究使Webpack使用正确的"background.[hash] .js"文件构建manifest.json文件但我认为，如果可以在文件名中找到禁用散列的选项，将会更容易

I will dig into making webpack building a manifest.json file with the correct "background.[hash].js" file but I thought it would be easier if I could find the options to disable hash in the name of the files

//vue.config.js

// vue.config.js

const CopyWebpackPlugin = require('copy-webpack-plugin');

module.exports = {
    chainWebpack: config => {
        // add your custom entry point
        config
            .entry('background')
            .add('./src/background.ts');
    },
    configureWebpack: {
        plugins: [
            new CopyWebpackPlugin([
                { from: 'manifest.json', to: 'manifest.json', flatten: true },
            ]),
        ]
    }
}

---

$ vue检查的结果.它太长了，所以我链接了一个pastebin https://pastebin.com/fbRzgfhY

推荐答案

花了很长时间试图了解webpack-chain，webpack及其插件的工作原理后，我在vue文档中发现了简单的"filenameHashing"错误: https://cli.vuejs.org/config/#indexpath

After spending so long trying to understand how webpack-chain, webpack and its plugins works I found the easy "filenameHashing" falg in the vue documentation : https://cli.vuejs.org/config/#indexpath

这是我的vue.config.js文件内容:

Here is my vue.config.js file content:

// vue.config.js
const CopyWebpackPlugin = require('copy-webpack-plugin');

module.exports = {
    filenameHashing: false, // <=================line that matters
    chainWebpack: config => {
        // add your custom entry point
        config
            .entry('background')
            .add('./src/background.ts');
    },
    configureWebpack: {
        plugins: [
            new CopyWebpackPlugin([
                { from: 'manifest.json', to: 'manifest.json', flatten: true },
            ]),
        ]
    }
}

这篇关于Webpack配置:从* .js条目/捆绑文件名中删除哈希的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！