webpack打包配置模板
/**
* Created by zzq on 2017/3/26.
*/
//__dirname是node.js中的一个全局变量,它指向当前执行脚本所在的目录
module.exports = {//注意这里是exports不是export
entry: __dirname + "/app/main.js",//唯一入口文件,就像Java中的main方法
output: {//输出目录
path: __dirname + "/build",//打包后的js文件存放的地方
filename: "result.js"//打包后的js文件名
}, module: {
//loaders加载器
loaders: [
{
test: /\.(js|jsx)$/,//一个匹配loaders所处理的文件的拓展名的正则表达式,这里用来匹配js和jsx文件(必须)
exclude: /node_modules/,//屏蔽不需要处理的文件(文件夹)(可选)
loader: 'babel'//loader的名称(必须)
}
]
}, //webpack-dev-server配置
devServer: {
contentBase: './build',//默认webpack-dev-server会为根文件夹提供本地服务器,如果想为另外一个目录下的文件提供本地服务器,应该在这里设置其所在目录(本例设置到"build"目录)
colors: true,//在cmd终端中输出彩色日志
historyApiFallback: true,//在开发单页应用时非常有用,它依赖于HTML5 history API,如果设置为true,所有的跳转将指向index.html
inline: true,//设置为true,当源文件改变时会自动刷新页面
port: 8080,//设置默认监听端口,如果省略,默认为"8080"
process: true,//显示合并代码进度
}
};
test: /\.(js|jsx)$/,
exclude: /node_modules/,
loader: 'babel-loader'这个必须写为babel-loader不能简写
webpack打包配置模板的更多相关文章
- vue-cli+webpack打包配置
vue-cli+webpack打包配置 一: 目录结构: ├── README.md ├── build │ ├── build.js │ ├── check-versions.js │ ├── ut ...
- 【nodejs代理服务器二】nodejs webpack打包配置踩坑总结
接着上篇用Nodejs开发web代理,防止web渗透.如果部署到正式环境,需要进行打包配置. 我在用webpack打包配置中遇到了几个错误,总结如下: webpack环境变量问题 https://ww ...
- webpack打包配置禁止html标签全部转为小写
用webpack打包页面,发现html中特别写的用来给后端识别的大写标签全部被转为了小写标签,这时候需要将加一个配置 ,caseSensitive:true ,禁止大小写转换. webpack配置: ...
- vue 应用生产环境的 webpack 打包配置优化
转:https://blog.csdn.net/robin_star_/article/details/83856363 前言:很好的打包优化的帖子,还没来的急去实测验证 1. 去掉 console ...
- webpack打包配置中出现的问题
第一个错误: One CLI for webpack must be installed. These are recommended choices, delivered as separate p ...
- vue-cli中的webpack打包配置
如下: assetsSubDirectory: 'static', assetsPublicPath: '/projectName/', 其中assetsSubDirectory是代表服务器上的实际路 ...
- 在找一份相对完整的Webpack项目配置指南么?这里有
Webpack已经出来很久了,相关的文章也有很多,然而比较完整的例子却不是很多,让很多新手不知如何下脚,下脚了又遍地坑 说实话,官方文档是蛮乱的,而且有些还是错的错的..很多配置问题只有爬过坑才知道 ...
- webpack4.x打包配置
很长时间没有进行webpack打包配置了,想起来都快有些忘记了,这个东西不是经常用到,只有在新建个项目的时候用到,不用官方模板,自己去动手配置的时候,有时候觉得还是有点难度.今天就想着自己动手进行配置 ...
- 深入浅出的webpack构建工具---webpack基本配置(一)
深入浅出的webpack构建工具---webpack基本配置(一) 阅读目录 一:webpack入门构建: 1. 安装webpack到全局 2. 安装webpack到本项目. 3. 如何使用webpa ...
随机推荐
- 基于jQuery+HTML5加入购物车代码
基于jQuery+HTML5加入购物车代码.这是一款基于jquery+html5实现的支持累加计价的网站购物车代码.效果图如下: 在线预览 源码下载 实现的代码. html代码: <div ...
- bootstrap学习-初步使用介绍
准备 下载Bootstrap https://github.com/twbs/bootstrap/releases/download/v3.3.6/bootstrap-3.3.6-dist.zip h ...
- Android应用图标微技巧,8.0系统中应用图标的适配
现在已经进入了2018年,Android 8.0系统也逐渐开始普及起来了.三星今年推出的最新旗舰机Galaxy S9已经搭载了Android 8.0系统,紧接着小米.华为.OV等国产手机厂商即将推出的 ...
- (笔记)Linux内核学习(一)之内核介绍
内核与操作系统: 内核是操作系统的核心部分,包含了系统运行的核心过程,决定系统的性能,操作系统启动内核被装入到RAM中: 操作系统与底层硬件设备交互和为运行应用程序提供执行环境. Linux内核与微内 ...
- 说说自己对RESTful API的理解
REST不是英文上的rest单词,其英文缩写为presentational State Transfer ,直译为表现状态转移,咋看起来很学术,不懂,其实不用去死抠这个词的意思.REST是一种约束和架 ...
- IE11不能使用F12功能DOM资源管理器无法使用
https://www.ludou.org/win7-ie-11-f12-bug.html 32位win7下载补丁:http://www.microsoft.com/zh-CN/download/de ...
- [UFLDL] *Sparse Representation
Deep learning:二十九(Sparse coding练习) Deep learning:二十八(使用BP算法思想求解Sparse coding中矩阵范数导数) Deep learning:二 ...
- Linux里的2>&1究竟是什么
我们在Linux下经常会碰到nohup command>/dev/null 2>&1 &这样形式的命令.首先我们把这条命令大概分解下首先就是一个nohup表示当前用户和系统 ...
- 用addOnGlobalLayoutListener获取View的宽高
首先,我们在onCreate方法里调用getHeight()和 getWidth()是不能正确获取View的宽高的,因为onCreate方法执行完了,我们定义的控件才会被onMeasure()度量,所 ...
- Android中使用第三方jar包
步骤: 方法1:Eclipse下, 右键工程, Build path, java build path, 选择libraries 在右边的按钮中点击“Add Library” 选择“User libr ...