webpack学习

webpack的安装

 npm install webpack -g

Webpack文件打包配置：

1.执行npm init 命令后，会自动导入Node需要的依赖包；

-1.1生成对应大文件

package.json

{
  "name": "vuewebpack",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "wangwei"
}
//生成了package.json即可借助于path获取当前项目所在的绝对路径

2.Webpack入口文件和出口文件的配资

webpage.config.js

const path = require('path')  //导入node的全局变量path
module.exports={
  entry:'./src/main.js'.
  output:{
    path:path.resolve(__dirname,'dist') //当前项目所在的绝对路径
    filename:'bundle.js'
}.
}

3.配置定义 npm run build 命令

在控制台输入执行命令 npm run xxx 的时候，node会到“package.json”文件中的脚本“scripts”中查找对应的脚本,如 “test” 即：npm run test

 "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },

如果要执行npm run build，需要在webpage.config.js中增加脚本：

 "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"，
     “build”:"webpack"
  },