就拿Vue项目来说，比如要将src/assets/js下的静态js文件，直接在public/index.html中引用：

这时候没有在项目中引用，不会经过wenpack的loader，也就不会自己打包到dist目录下。

可以通过配置vue.config.js来实现：

cmd:

npm install uglify-es --save-dev

vue.config.js:

const UglifyJS = require('uglify-es');

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

function resolve (dir) {

    return path.join(__dirname, dir);

}

module.exports = {

    ...

    configureWebpack: config => {

    config.plugins.push(

            new CopyWebpackPlugin([

                {

                    from: resolve('src/assets/js'),

                    to: 'js',

                    transform: function (content) {

                        return UglifyJS.minify(content.toString()).code;

                    }

                }

            ])

        );

    }

}

index.html:

<!DOCTYPE html>

<html lang="zh-cmn-Hans">

  <head>

    ...

    <script src="<%= BASE_URL %>js/mobile-response.js"></script>

  </head>

  ...

</html>

至此就算大功告成。

The end...Last updated by Jehorn, 5:17 PM, Wednesday, May 8, 2019

Webpack将静态资源拷贝并压缩至输出文件夹的更多相关文章

  1. node静态资源服务器的搭建----访问本地文件夹（搭建可访问静态文件的服务器）

    我们的目标是实现一个可访问静态文件的服务器,即可以在浏览器访问文件夹和文件,通过点击来查看文件. 1.先创建一个文件夹anydoor,然后在该文件夹里npm init一个package.json文件, ...

  2. Webpack 常见静态资源处理 - 模块加载器（Loaders）+ExtractTextPlugin插件

    Webpack 常见静态资源处理 - 模块加载器(Loaders)+ExtractTextPlugin插件 webpack系列目录 webpack 系列 一:模块系统的演进 webpack 系列 二: ...

  3. vue项目之webpack打包静态资源路径不准确

    摘自:https://blog.csdn.net/viewyu12345/article/details/83187815 问题 将打包好的项目部署到服务器,发现报错说图片找不到. 静态资源如js访问 ...

  4. ASP.NET MVC 静态资源打包和压缩问题小记

    ASP.NET MVC 中有个 BundleConfig 用于静态资源的打包和压缩,我在使用的过程中遇到一些问题,现在做下总结,并给出具体的解决方案. 问题一:打包压缩后的 JavaScript 和 ...

  5. Nginx的静态资源缓存以及压缩

    Nginx是一款轻量级的网页服务器.反向代理器以及电子邮件代理服务器.Nginx采用的是异步非阻塞的通信机制(epoll模型),支持更大的并发连接.所谓的epoll模型:当事件没有准备好时,就放入ep ...

  6. nginx静态资源缓存与压缩

    一.静态资源缓存 参考文章 (1)apache设置max-age或expires 这里需要修改.htaccess文件. <IfModule mod_headers.c> <Files ...

  7. vue打包静态资源后显示空白及static文件路径报错

    1.打包之后打开dist的页面显示空白: 这个是打包项目比较常见的一个错误 改一下config下面的index.js中bulid模块导出的路径.因为打包后的index.html里边的内容都是通过scr ...

  8. spring-boot配置静态资源映射的坑：properties文件不能添加注释

    如此博文所述,Spring Boot 对静态资源映射提供了默认配置 默认将 /** 所有访问映射到以下目录:classpath:/staticclasspath:/publicclasspath:/r ...

  9. 【转载】.NET压缩/解压文件/夹组件

    转自:http://www.cnblogs.com/asxinyu/archive/2013/03/05/2943696.html 阅读目录 1.前言 2.关于压缩格式和算法的基础 3.几种常见的.N ...

随机推荐

  1. HttpWebRequest Timeout

    随着REST风格的流行,直接通过 HttpWebRequest 进行服务调用的客户端应用越来越多.这里总结一些可能需要费时调查的经验,希望能帮助大家. 1. 用完的HttpWebRequest要Abo ...

  2. flink 读JDQ和写JDQ的流程

    ReadFromJDQ3 1)消费JDQ的必要信息,通过参数传入,有6个参数 2)获取flink JDQ3的鉴权客户端 3)根据鉴权客户端获取消费属性的配置 4)构建应用环境ENV和checkpoin ...

  3. 即时通信系统IM--XMPP

    即时通讯(Instant Messaging)是目前Internet上最为流行的通讯方式,各种各样的即时通讯软件也层出不穷:服务提供商也提供了越来越丰富的通讯服务功能. 不容置疑,Internet已经 ...

  4. Chaos Engineering 混沌工程 Chaos Monkey vs Chaos xxx vs Chaos Blade

    Chaos Engineering的历史.原则以及实践https://www.infoq.cn/article/chaos-engineering-the-history-principles-and ...

  5. [原][OE][官方例子]osgearth_features OE地球添加shp文件（特征标识）

    OE所有官方样例 官方示例代码 /* -*-c++-*- */ /* osgEarth - Dynamic map generation toolkit for OpenSceneGraph * Co ...

  6. 实战c++中的string系列--std:vector 和std:string相互转换(vector to stringstream)

    string.vector 互转 string 转 vector vector  vcBuf;string        stBuf("Hello DaMao!!!");----- ...

  7. 006-guava 集合-集合工具类-集合扩展工具类

    一.概述 需要实现自己的集合扩展.也许你想要在元素被添加到列表时增加特定的行为,或者你想实现一个Iterable,其底层实际上是遍历数据库查询的结果集 二.使用 2.1.ForwardingList装 ...

  8. vector 移除元素

    vector中移除“与某值相等”的第一个元素. std::vector<Elem> coll; ... //remove first element with value val std: ...

  9. 基于grafana+prometheus构建Flink监控

    先上一个架构图 Flink App : 通过report 将数据发出去 Pushgateway :  Prometheus 生态中一个重要工具 Prometheus :  一套开源的系统监控报警框架 ...

  10. 容器版jenkins安装并且实现使用宿主机docker命令，采用的是docker outside deocker，带jdk、添加maven、git

    docker版jekins使用宿主机docker命令 docker版jekins安装,实现CI/CD,也就是实现在容器里面使用宿主机docker命令,这样方式为:docker outside deoc ...