初始化一個新的npm
步驟一：
初始化npm項(xiàng)目，創(chuàng)建一個package.json文件
npm init -y步驟二：
添加打包腳本：在scripts部分添加一個命令來運(yùn)行webpack
"scripts": {
? "build": "webpack --config webpack.config.js"
},步驟三：
安裝Webpack
npm install --save-dev webpack webpack-cli步驟四：
創(chuàng)建一個簡單的Javascript文件，比如src/index.js
console.log('Hello,Webpack!');步驟五：
配置Webpack，創(chuàng)建一個名為webpack.config.js的文件文章來源：http://www.zghlxwxcb.cn/news/detail-820094.html
const path = require('path'); // 《引入path模塊》如 join()、basename()、dirname()、extname() 等，
?
module.exports = {
mode: 'development', // 設(shè)置模式為開發(fā)模式，可以設(shè)置為 'production' 以啟用壓縮等優(yōu)化
entry: './src/index.js', // 設(shè)置入口文件為 './src/index.js'
output: { //設(shè)置輸出目錄為 path.resolve(__dirname, 'dist')
? path: path.resolve(__dirname, 'dist'), // 輸出目錄
? filename: 'bundle.js' // 設(shè)置輸出文件為 'bundle.js'
}
};步驟六：
打包項(xiàng)目：文章來源地址http://www.zghlxwxcb.cn/news/detail-820094.html
npm run build到了這里，關(guān)于Webpack打包簡單的js文件的文章就介紹完了。如果您還想了解更多內(nèi)容，請?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
