webpack不混淆、不压缩指定js文件

在项目中使用了mozilla/pdf.js，在使用中需要设置GlobalWorkerOptions.workerSrc，代码如下

import PDFJS from 'pdfjs-dist'
import workerSrc from 'pdfjs-dist/build/pdf.worker.js'
PDFJS.GlobalWorkerOptions.workerSrc = workerSrc;
console.log('workerSrc-->\n',workerSrc);

在运行的时候发现workerSrc被webpack和Babel压缩混淆成了代码字符串，而非PDFJS.GlobalWorkerOptions.workerSrc需要的xxx/pdf.worker.js这种形势的文件路径。

vuecl3配置

vuecl3免混淆js文件的配置方法如下，vue.config.js文件

   module.exports = {
   chainWebpack: config => {
       config.module
           .rule('pdf.worker.js')//名称 随意定制，应当避免重复
           .test(/pdf\.worker\.js$/i) //正则文件名
           .use('url-loader')
           .loader('url-loader')
           .tap(() => ({ limit: 10,name:'js/[name].[ext]' }))
           .end();
   }
}

运行npm run build后可以看到pdf.worker.js文件被忽略了，没有被混淆压缩，并且文件名也保持原模原样。

非vuecl3的weback配置

react工程或者vuecl2工程的webpack避免混淆压缩指定js代码配置如下:
config/webpack.config.dev.js和config/webpack.config.prod.js文件

...忽略
module.exports = {
    ...忽略
    module: {
        loaders:[
            ...忽略
            {
                test:/pdf\.worker\.js$/i,
                loader: 'url',
                query: {
                    limit: 10,
                    name: 'js/[name].[ext]'
                }
            }
        ],
    }
};

以上就是webpack不打包指定的js文件的相关配置