bundle包是什么意思_webpack打包后的bundlejs文件代码不知道什么意思.

正如楼上所说.你最好再编辑下你的问题.

建议你结合webpack的文档,与各教程对照学习.

根据你的目录结构,我推测下webpack.config.js的写法,我也是初学,有不对之处欢迎各位扶正.

假设你开发目录结构

text_pro/

|- node_modules/

|- src/

|- |- js/

|- |- |- main.js

|- |- |- Greeter.js

|- |- index.html

|- webpack.config.js

|- package.json

// webpack.config.js

var path = require('path'),

HtmlWebpackPlugin = require('html-webpack-plugin'),

webpack = require('webpack');

module.exports = {

entry: {

// greeter: './src/js/Greeter.js', // 把greeter文件单独提取出来.

main: './src/js/main.js' // 如果不单独提取greeter文件,它将跟main打包到一起.

},

output: {

path: path.resole(__dirname, 'dist'), // 输出路径

filename: 'js/[name].[hash:5].js' // 输出文件名,[hash:5]这里的:5意思是只要hash的5个字符,当时看各教程案例都没解释这个,搞的我一开始也不明白这是什么用意.

},

// 以上基本就算完成了webpack工程化,如果你要把引用的greeter文件提取出来就使用 CommmonsChunkPlugin插件.

plugins: [

new webpack.optimize.CommmonsChunkPlugin({name: 'greeter'}),

new HtmlWebpackPlugin() // 该插件是把打包的JS所应用到的html中.

]

}

// package.json

{

"name": "test_pro",

"version": "1.0.0",

"description": "",

"main": "index.js",

"scripts": {

"dev": "webpack-dev-server --progress --colors --inline",

"build": "webpack -p"

},

"author": "",

"license": "ISC",

"devDependencies": {

"html-webpack-plugin": "^2.29.0",

"webpack": "^3.0.0",

"webpack-dev-server": "^2.5.0"

}

}