node -v
建立配置項html
npm init
或者node
npm init --y
此時生成package.json文件webpack
全局安裝webpack和webpack-cliweb
npm install webpack webpack-cli -g
在項目文件夾中安裝webpack和webpack-clinpm
npm install webpack webpack-cli --save-dev
配置生產和開發模式
pakage.json中"scripts"參數表示自定義命令,這裏咱們能夠添加以下代碼:json
"dev": "webpack --mode development", "build": "webpack --mode production"
建立入口文件瀏覽器
./src/script/main.js
在項目路徑下建立webpack配置文件,默認不須要配置,這裏咱們能夠自定配置選項編輯器
entry表示入口文件的地址;output表示輸出信息,其中,path爲輸出文件的目錄地址,若是沒有則自動生成(**必需要絕對路徑**),filename表示生成的文件名
運行:ui
npm run dev 表示開發模式
打包完成,此時在./dist/js/下生成了一個bundle.js文件
npm run build 表示生產模式,此時的main.js 被壓縮
正確無誤輸出了咱們在入口js文件中編寫的代碼,打包成功!spa