webpack 使用配置文件
webpack入门 大多数项目会需要很复杂的设置,这就是为什么webpack要支持配置文件。这比在终端中输入大量命令要高效的多,所以让我们常见一个取代CLI选项方式的配置文件
新建 webpack.config.js
const path = require('path'); module.exports = {
entry: './src/index.js',//设置入口文件
output: {
filename: 'bundle.js',//生成的输出文件名称
path: path.resolve(__dirname, 'dist')//输出文件的路径
}
};
构建配置文件:
./node_modules/.bin/webpack --config webpack.config.js
运行结果:
Hash: ff6c1d39b26f89b3b7bb
Version: webpack 2.2.0
Time: 390ms
Asset Size Chunks Chunk Names
bundle.js 544 kB 0 [emitted] [big] main
[0] ./~/lodash/lodash.js 540 kB {0} [built]
[1] (webpack)/buildin/global.js 509 bytes {0} [built]
[2] (webpack)/buildin/module.js 517 bytes {0} [built]
[3] ./src/index.js 278 bytes {0} [built]
tip:如果 webpack.config.js
存在,则 webpack
命令将默认选择使用它。我们在这里使用 --config
选项只是向你表明,可以传递任何名称的配置文件。这对于需要拆分成多个文件的复杂配置非常有用。
webpack 使用配置文件的更多相关文章
- 跟我一起学习webpack使用配置文件(二)
接着跟我一起学习webpack(一)中的项目来,我们接下来使用配置文件 使用npx webpack -h 我们可以查看webpack的配置参数 从我们在package.json中添加的命令来看,当项目 ...
- webpack基本配置文件(含解释)
const path = require('path'); // 以下文件需要npm i 文件名 --save-dev const uglify = require('uglifyjs-webpack ...
- webpack的配置文件
1.路径 __dirname是一个全局变量,在项目html和js中没有单独定义,直接写就可以得到项目的根目录的路径 module.exports={ // __dirname是nodejs里的一个全局 ...
- webpack基本配置文件
entry(入口文件) 可以传字符串,数组,对象三种格式(字符串和数组默认生成main.js,均生成一个文件,对象有几个入口文件,生成几个文件).默认值为./src/index.js.entry可以传 ...
- webpack的配置文件entry与output
在webpack.config.js中entry是唯一入口文件 entry也可以是一个数组 如果是一个数组,会将数组里面的文件一起打包到bundle.js entry也可以是一个对象. 如果outpu ...
- vue 项目中 自定义 webpack 的 配置文件(webpack.config.babel.js)
webpack.config.babel.js,这样命名是想让webpack在编译的时候自动识别es6的语法,现在貌似不需要这样命名了,之前用webpack1.x的时候貌似是需要的 let path ...
- webpack的配置文件[webpack.config.js]
如果项目里没有webpack.config.js这个文件,webpack会使用它本身内置在源码里的配置项. webpack.config.js这个配置名称可以通过指令修改 npx webpack -- ...
- webpack基础+webpack配置文件常用配置项介绍+webpack-dev-server
一.webpack基础 1.在项目中生成package.json:在项目根目录中输入npm init,根据提示输入相应信息.(也可以不生成package.json文件,但是package.json是很 ...
- react暴露webpack配置文件
在react中安装create-react-app脚手架新建项目,但是新建的项目中没有配置文件. webpack的配置文件webpack.base.conf.js隐藏在了node_modules文件夹 ...
随机推荐
- 深入GCD(四):使用串行队列实现简单的预加载
其主要思路是使用gcd创建串行队列,然后在此队列中先后执行两个任务:1.预加载一个viewController 2.将这个viewController推入代码如下:@implementation DW ...
- 转:国内Top500Android应用分析报告
转自:https://mp.weixin.qq.com/s?__biz=MzA5OTMxMjQzMw==&mid=2648112527&idx=1&sn=b23c1b5f3e3 ...
- 【Android小项目】找不同,改编自"寻找房祖名"的一款开源小应用。
近期在微信朋友圈"寻找房祖名"和"万里寻刀"这类小游戏比較火.我试着写了一个android版本号的,里面全是一系列的形近字,实现原理非常easy:用一个Grid ...
- cin,和几个get函数的用法
1.cin.get(字符变量名):用来接收字符 ch = cin.get(); cin.get(ch); 以上两者均可以 2.cin.get(字符数组名,接收字符数目)用来接收一行字符串,可以接收空格 ...
- Spark Streaming性能优化系列-怎样获得和持续使用足够的集群计算资源?
一:数据峰值的巨大影响 1. 数据确实不稳定,比如晚上的时候訪问流量特别大 2. 在处理的时候比如GC的时候耽误时间会产生delay延迟 二:Backpressure:数据的反压机制 基本思想:依据上 ...
- SVN——库合并
从下午開始做库的合并.刚開始一直将路径弄错.后来纠结至死的时候,finally and finally,succeed~ 库合并是这样子的: 如今,我要把项目1这个库合并到部门1的项目1目录中,为了 ...
- 豆瓣面试题strstr)
/*(豆瓣2013面试题strstr) 有一个在给定字符串中查找子串的函数strstr, 该函数从给定的字符串src中查找substr并返回一个整数, 指明substr第一次出现的位置(从0开始计数) ...
- iOS UIButton选中状态切换
UIButton*payBtn = [UIButtonbuttonWithType:UIButtonTypeCustom]; payBtn.frame=CGRectMake(size.width-24 ...
- Git使用之Permission Denied问题解决
今天碰到了Git的Permission Denied问题. 在安装好git之后,我们通常会配置username和邮箱 git config --global user.name "zengj ...
- python day - 17 面向对象的 类空间 和 组合
1. 类命名空间 在类的代码中,当python 解释器在 运行的那一刻.就会在内存中开辟一个类空间,在类的空间中会加载静态变量,以及类方法的内存地址. 当类名+()(也就是实例化过程中),内存中会再次 ...