就拿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. 第10组 Alpha冲刺(3/6)

    链接部分 队名:女生都队 组长博客: 博客链接 作业博客:博客链接 小组内容 恩泽(组长) 过去两天完成了哪些任务 描述 对推送模块进行详细划分 基于用户的协同过滤,寻找更感兴趣的话题 学习API文档 ...

  2. [转] Filezilla server设置指南及中文乱码、登录欢迎语问题解决

    一.filezilla server 安装指南:FileZilla是一款免费而且开源的FTP工具.包括FileZilla Client,FileZilla Server两个版本.FileZilla S ...

  3. CEF3设置cookie

    #include "CEF3Helper.h" #include "../include/cef_app.h" #include "../includ ...

  4. 《Linux设备驱动程序》第三版 scull编译 Ubuntu18.04

    0 准备工作. 0.0 系统环境:Ubuntu18.04.1 amd64. 0.1 安装必要软件包 1 sudo apt install build-essential bison flex libs ...

  5. Spark(五十二):Spark Scheduler模块之DAGScheduler流程

    导入 从一个Job运行过程中来看DAGScheduler是运行在Driver端的,其工作流程如下图: 图中涉及到的词汇概念: 1. RDD——Resillient Distributed Datase ...

  6. 阿里云yii2 composer update 很慢的解决办法

    先执行如下语句 composer global require "fxp/composer-asset-plugin:dev-master" 再执行 composer update

  7. bat 获取 exe 文件中 产品版本号并存储到变量中

    set EXE='D:\gitlab\drivereasy3\DriverEasyWPF\bin\Release\DriverEasy.exe' powershell "(Get-Item ...

  8. windows使用pipenv创建虚拟环境报错UnicodeDecodeError: 'utf-8' codec can't decode byte 0xce in position 4: in...

    原因: 因为windows默认GBK编码,所以报错 解决方法: 最正确的解决方式不清楚,我的解决方式是修改源码,亲测有效: 将你报错位置的(报错位置在你的错误信息里) str(pe.szExeFile ...

  9. 先查询再插入,改为存储过程,java部分入参出参、mybatisxml【我】

    先查询再插入,改为存储过程 create or replace procedure PRO_REVENUE_SI(l_p_cd in Varchar2, l_c_cd in Varchar2, l_p ...

  10. visual studio code跳转到定义处插件

    visual studio code 中使用跳转到定义处的插件 https://marketplace.visualstudio.com/items?itemName=Shan.code-settin ...