簡易的打包js
我在網(wǎng)上找了些資料，自己動手試了試打包js，記錄下過程
安裝依賴
安裝插件
npm?install?--save-dev?webpack
npm?install?--save-dev?webpack-cli
編寫webpack
我們先建一個webpack.config.js的文件瓮下，然后進行配置
const?path?=?require('path');?//?獲取當前絕對路徑
module.exports?=?{
??entry:?"./index.js",?//?主文件入口
??output:?{
????filename:?"bundle.js",?//?打包后的文件
????path:?path.resolve(__dirname,?"./dist"),
??}
}
這是一個很簡單的配置盖腕，配置了entry需要打包的文件，再配置filename打包后文件的名字和path打包文件放置的位置
path.resolve是拼接路徑用的并巍，__dirname是獲取絕對路徑目木，再加上"./dist"我們的目標文件夾，這樣可以得到我們目標文件夾的絕對路徑
編寫啟動程序(package.json)
npm?允許在package.json文件里面懊渡，使用scripts字段定義腳本命令刽射。詳情可以看[npm?scripts?使用指南](http://www.ruanyifeng.com/blog/2016/10/npm_scripts.html)
我們現(xiàn)在設置打包的腳本
"scripts":?{
????"build":?"webpack?--mode?production",
????"dev":?"webpack?--mode?development?--watch"
??}
腳本里，我用了一些參數(shù)
- mode
mode有三個選項距贷，
1.?none
2.?production(生產(chǎn)環(huán)境)
3.?development(開發(fā)環(huán)境)
- watch
監(jiān)聽js自動打包
啟動腳本柄冲，打包js
npm?run?dev?（生產(chǎn)環(huán)境）能監(jiān)聽js自動打包
npm?run?build?（生產(chǎn)環(huán)境）生產(chǎn)環(huán)境打包
js已經(jīng)打包到dist文件夾里了
