转移文件的插件

加载插件

$ 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即构建目录的路径
  • basePath(可选的):要从参数中解析目录

示例

目录结构

  • build

    • test
  • src
    • test

      • test.js
    • index.js
  • 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最简使用示例的更多相关文章

  1. 如何开发webpack plugin

    继上回介绍了如何开发webpack loader 之后.趁热打铁,来继续看下webpack另一个核心组成:plugin. 下面也和loader一样,让我们一起从基本的官方文档着手看起. loader和 ...

  2. 简单webpack plugin 开发

    重要是学习下怎么开发webpack plugin,同时记录下 插件模型 webpack 是一个插件,可以是javascript class ,或者具名 class 定义apply 方法 指定一个绑定到 ...

  3. Webpack Plugin

    [Webpack Plugin] Since Loaders only execute transforms on a per-file basis, plugins are most commonl ...

  4. 案例实战之如何写一个webpack plugin

    案例实战之如何写一个webpack plugin 1.写一个生成打包文件目录的file.md文件 // 生成一个目录项目目录的文件夹 class FileListPlugin { constructo ...

  5. 揭秘webpack plugin

    前言 Plugin(插件) 是 webpack 生态的的一个关键部分.它为社区提供了一种强大的方法来扩展 webpack 和开发 webpack 的编译过程.这篇文章将尝试探索 webpack plu ...

  6. YYDS: Webpack Plugin开发

    目录 导读 一.cdn常规使用 二.开发一个webpack plugin 三.cdn优化插件实现 1.创建一个具名 JavaScript 函数(使用ES6的class实现) 2.在它的原型上定义 ap ...

  7. copy-webpack-plugin最简使用示例

    拷贝文件的插件 加载插件 $ npm install copy-webpack-plugin --save-dev API new CopyWebpackPlugin(patterns: Array, ...

  8. webpack 安装使用简例

    1. 新建项目文件夹,如 webpack-demo 2. cd 到安装项目根目录,即进入webpack-demo文件夹,命令行工具输入"npm install webpack webpack ...

  9. [转] webpack之plugin内部运行机制

    简介 webpack作为当前最为流行的模块打包工具,几乎所有的主流前端开发框架(React.Vue等)都会将其作为默认的模块加载和打包工具.通过简单的配置项,使用各种相关的loader和plugin, ...

随机推荐

  1. Object.keys、Object.getOwnPropertyNames区别

    用途 Object.keys 定义:返回一个对象可枚举属性的字符串数组: Object.getOwnPropertyNames 定义:返回一个对象可枚举.不可枚举属性的名称: 属性的可枚举性.不可枚举 ...

  2. Asp.net Mvc 与 Web Api生命周期对比

    完整的生命周期比较复杂,对细节感兴趣的同学可购买老A的图书学习:传送门 本文只简单讲述路由注册.controller创建.action选择的3个主逻辑线,其他的内容大家可自己阅读相应的代码 先上二者单 ...

  3. cs231n spring 2017 lecture15 Efficient Methods and Hardware for Deep Learning 听课笔记

    1. 深度学习面临的问题: 1)模型越来越大,很难在移动端部署,也很难网络更新. 2)训练时间越来越长,限制了研究人员的产量. 3)耗能太多,硬件成本昂贵. 解决的方法:联合设计算法和硬件. 计算硬件 ...

  4. 2017 Multi-University Training Contest - Team 1 1001&&HDU 6033 Add More Zero【签到题,数学,水】

    Add More Zero Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 131072/131072 K (Java/Others)T ...

  5. BZOJ3109: [cqoi2013]新数独

    题目:http://www.lydsy.com/JudgeOnline/problem.php?id=3109 搜索一遍.读入注意一下.. #include<cstring> #inclu ...

  6. linux系统下,警告:warning: implicit declaration of function ‘gets’ [-Wimplicit-function-declaration] 和 warning: the `gets' function is dangerous and should not be used. 的由来和解决方法。

    字符数组 的英文名字是 char [] gets()函数的基本用法为:char *gets(char *s); 该函数的参数是一个字符数组,该函数的返回值也是一个字符数组. linux下的代码如下: ...

  7. Arduino 开源库 u8glib2 之 图标显示【原创】

    Arduino 开源库 u8glib2 研究之 图标显示                -----------------关于drawXBM drawXBMP函数使用的研究 因为心血来潮,近来想做一个 ...

  8. 浅谈localStorage、sessionStorage 与cookie

    由于工作的需要,今天使用了下localStorage.sessionStorage和cookie,感觉这玩意儿还挺好用的. 关于localStorage与sessionStorage的知识点以及用法之 ...

  9. HDU 2412 Farm Irrigation

    题目: Benny has a spacious farm land to irrigate. The farm land is a rectangle, and is divided into a ...

  10. error: Failed dependencies:解决

    error: Failed dependencies:解决 使用rpma安装安装包时,会出现 error: Failed dependencies: 意思是 失败的依赖 解决方法: 在安装包后面加两个 ...