码迷,mamicode.com
首页 > Web开发 > 详细

Webpack初识

时间:2017-04-02 19:22:04      阅读:203      评论:0      收藏:0      [点我收藏+]

标签:title   undle   字符   file   div   目录   exp   conf   ack   

1.安装

全局安装:

npm install webpack -g

在项目目录下安装:

npm install webpack --save-dev

打包文件基础命令:

webpack source.js bundle.js

2.配置

在目录下创建webpack.config.js配置文件,另外也可以用--config指定配置文件;在配置文件用module.exports指定一个配置文件,各个配置参数都是以键值对的形式:

(1) 入口配置entry:字符串/数组/对象

字符串:单个入口文件

数组:单个入口,但是存在多个相互依赖的文件

对象:多个入口文件,此时对应的出口filename也要改成多出口形式,不然会报错

(2) 出口配置output:对象形式。其中path和filename字段表示打包的路劲和打包后的文件名,注意的是当存在多个入口的时候,打包的文件名要修改成自动生成的形式。

(3)例子:

const path = require(‘path‘);

module.exports = {
    entry: {
        main: ‘./src/script/main.js‘,
        a: ‘./src/script/a.js‘
    },
    output: {
        path: path.resolve(__dirname,‘dist/js‘),
        filename: ‘[name].js‘
    }
}

Webpack初识

标签:title   undle   字符   file   div   目录   exp   conf   ack   

原文地址:http://www.cnblogs.com/wozien/p/6659565.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!