首页 > 代码库 > webpack02

webpack02

consumer-index.html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Consumer</title>
</head>
<body>
<h1>Consumer Page</h1>
<p id="content"></p>
<script src="/dist/consumer.bundle.js"></script>
</body>
</html>

consumer-index.js

document.getElementById(‘content‘).innerText = ‘This is Consumer page‘;

admin-index.html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Admin</title>
</head>
<body>
<h1>Admin Page</h1>
<p id="content"></p>
<script src="/dist/admin.bundle.js"></script>
</body>
</html>

admin-index.js

document.getElementById(‘content‘).innerText = ‘This is Admin page‘;

webpack.config.js

var path = require(‘path‘);//自带标准库

var config = {
  entry: {
    admin: ‘./admin/index.js‘,    //2个入口
    consumer: ‘./consumer/index.js‘    //2个入口
  },
  output: {
    path: path.join(__dirname, ‘dist‘),    //dist放打包出来的文件
    publicPath: ‘/dist/‘,    //webpack自带的测试环境server
    filename: ‘[name].bundle.js‘
  }
};

module.exports = config;

package.json

{
  "name": "demo2",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "webpack-dev-server --progress --colors --hot --inline",//启动开发环境需要的东西
    "build": "webpack --progress --colors -p"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "node-argv": "0.0.7",
    "webpack": "1.12.1",
    "webpack-dev-server": "1.10.1"
  }
}

 

webpack02