标签:doc head nbsp 配置 配置文件 字符串 目的 path pac
webpack安装
1.安装之前你必须要安装node.js,如果你没安装可以在node.js网去下载node.js
2.全局安装webpack,打开cmd输入npm install webpack -g
3.cmd cd进入当前目录,输入npm init命令,一直按Enter,然后在当前文件夹会出现package.json文件
当前目录为webpackTest
webpack就安装成功了
webpack的配置
1.创建项目文件夹,文件夹的名字,不要叫“webpack”,并且不要包含大写字母,路径名不要包含中文
2.在当前目录下新建webpack.config.js配置文件,名字一定要是这个,不然会出错。因为这是webpack默认执行的文件
当前文件还有如下文件
out文件夹:存放出口文件
src文件夹
3.webpack.config.js配置文件的参数.
4.在src文件夹下的js文件夹下创建入口文件,我创建的是名为entry的js文件,在项目的根目录下新建index.html文件来试调使用;
webpack.config.js
module.exports = { entry : ‘./src/js/entry.js‘,//入口文件 output : {//输出文件 filename : ‘index.js‘,//输出文件名 path : __dirname + ‘/out‘//输出文件路径 }, }
entery.js
console.log(‘webpack‘);
index.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <title>ss</title> </head> <body> 111 <script src="./out/index.js"></script> <!-- 注意在这里引入的是打包完成的js文件 --> </body> </html>
cmd cd 进入当前项目的根目录,即webpackTest文件夹下;输入webpack或者webpack-w命令,查看html文件是否能console.log出"webpack"字符串
webpack和webpack-w的区别
webpack -w可以对项目打包并且实时监控, 当前配置文件下的文件如果发生更改时重新打包, 但如果webpack的配置文件即webpack.config.js更改时还是要通过webpack进行打包.(退出webpack -w 操作 ctrl+c)
标签:doc head nbsp 配置 配置文件 字符串 目的 path pac
原文地址:http://www.cnblogs.com/15fj/p/7892387.html