transfer-webpack-plugin最简使用示例
转移文件的插件
加载插件
$ npm install transfer-webpack-plugin --save-dev
API
new CopyWebpackPlugin(patterns: Array, basePath: String)
- patterns:数组,每项的格式为
{from: 'path', to: 'path'}。- from:相对于
basePath或者当前配置的context(如果basePath路径不存在)的路径 - to:相对于
build即构建目录的路径
- from:相对于
- basePath(可选的):要从参数中解析目录
示例
目录结构
- build
- test
- src
- test
- test.js
- index.js
- test
- webpack.config.js
配置信息
webpack.config.js
var path = require('path');
var TransferWebpackPlugin = require('transfer-webpack-plugin');
module.exports = {
entry: path.resolve(__dirname, 'src'),
output: {
path: path.resolve(__dirname, 'build'),
filename: 'app.js'
},
context: path.resolve(__dirname, 'src'), //可以不写
plugins: [
// 把src/test目录下的文件copy到build/test目录下
new TransferWebpackPlugin([{
from: 'test',
to: 'test'
}], path.resolve(__dirname, 'src'))
]
};
执行命令
$ webpack
参考地址
https://github.com/molforp/transfer-webpack-plugin
transfer-webpack-plugin最简使用示例的更多相关文章
- 如何开发webpack plugin
继上回介绍了如何开发webpack loader 之后.趁热打铁,来继续看下webpack另一个核心组成:plugin. 下面也和loader一样,让我们一起从基本的官方文档着手看起. loader和 ...
- 简单webpack plugin 开发
重要是学习下怎么开发webpack plugin,同时记录下 插件模型 webpack 是一个插件,可以是javascript class ,或者具名 class 定义apply 方法 指定一个绑定到 ...
- Webpack Plugin
[Webpack Plugin] Since Loaders only execute transforms on a per-file basis, plugins are most commonl ...
- 案例实战之如何写一个webpack plugin
案例实战之如何写一个webpack plugin 1.写一个生成打包文件目录的file.md文件 // 生成一个目录项目目录的文件夹 class FileListPlugin { constructo ...
- 揭秘webpack plugin
前言 Plugin(插件) 是 webpack 生态的的一个关键部分.它为社区提供了一种强大的方法来扩展 webpack 和开发 webpack 的编译过程.这篇文章将尝试探索 webpack plu ...
- YYDS: Webpack Plugin开发
目录 导读 一.cdn常规使用 二.开发一个webpack plugin 三.cdn优化插件实现 1.创建一个具名 JavaScript 函数(使用ES6的class实现) 2.在它的原型上定义 ap ...
- copy-webpack-plugin最简使用示例
拷贝文件的插件 加载插件 $ npm install copy-webpack-plugin --save-dev API new CopyWebpackPlugin(patterns: Array, ...
- webpack 安装使用简例
1. 新建项目文件夹,如 webpack-demo 2. cd 到安装项目根目录,即进入webpack-demo文件夹,命令行工具输入"npm install webpack webpack ...
- [转] webpack之plugin内部运行机制
简介 webpack作为当前最为流行的模块打包工具,几乎所有的主流前端开发框架(React.Vue等)都会将其作为默认的模块加载和打包工具.通过简单的配置项,使用各种相关的loader和plugin, ...
随机推荐
- ORM: object relationship mapping
ORM: object relationship mapping 关于数据库的两条命令: python manage.py makemigrations python manage.py migrat ...
- 在HTML页面中获取当前项目根路径的方法
在HTML页面获取项目根路径的方法: function getRootPath(){ var curPageUrl = window.document.location.href; var rootP ...
- 声音变调算法PitchShift(模拟汤姆猫) 附完整C++算法实现代码
上周看到一个变调算法,挺有意思的,原本计划尝试用来润色TTS合成效果的. 实测感觉还需要进一步改进,待有空再思考改进方案. 算法细节原文,移步链接: http://blogs.zynaptiq.com ...
- Machine Learning - week 1
Matrix 定义及基本运算 Transposing To "transpose" a matrix, swap the rows and columns. We put a &q ...
- CSS3中nth-of-type和nth-last-of-type
1.使用nth-child和nth-last-child时会产生的问题 在使用nth-child和nth-last-child时,其计算子元素是奇数个元素还是第偶数个元素时,是连同父元素中的所有子元素 ...
- 2017广东工业大学程序设竞赛E题(倒水)
Description 一天,CC买了N个容量可以认为是无限大的瓶子,开始时每个瓶子里有1升水.接着~~CC发现瓶子实在太多了,于是他决定保留不超过K个瓶子.每次他选择两个当前含水量相同的瓶子,把一个 ...
- App Doc View Frame中指针的获取
// App中获取其它三项指针 void CSDIApp::OnApp() { // App // Doc CDocument *pDoc = ((CFrameWndEx *)m_pMainWnd)- ...
- 基于TypeScript装饰器定义Express RESTful 服务
前言 本文主要讲解如何使用TypeScript装饰器定义Express路由.文中出现的代码经过简化不能直接运行,完整代码的请戳:https://github.com/WinfredWang/expre ...
- Flask连接数据库打怪升级之旅
一.前言 在初学 Flask 的时候,在数据库连接这部分也跟每个初学者一样.但是随着工作中项目接手的多了,代码写的多了,历练的多了也就有了自己的经验和技巧.在对这块儿代码不断的进行升级改造后,整理了在 ...
- IOS开发之纯代码界面--基本控件使用篇 ┊
http://www.cocoachina.com/bbs/read.php?tid=131516