webpack.config.js

module.exports={
    entry:'./app/index.js',
    output:{
        path:'./dist',
        filename:'bundle.js'
    },
    module:{
        loaders: [
            {
              test: /\.js$/,
              exclude: /node_modules/,
              loader: "babel-loader",
              query:
                {
                  presets:['react','es2015']
                }
            },
            {
                test: /\.json?$/,
                loader: 'json'
            },
            {
                test: /\.css$/,
                loader: "style!css"
            },
            {
                test: /\.less/,
                loader: 'style-loader!css-loader!less-loader'
            }
        ]
    }
}

  我对webpack.config理解是

新建一个index.html

引用打包好的bundle的js文件。

你可以在新建app文件,app中里可以有若个。

比如index.js 

var react=require("react");
var alert=require("./children/common.js");
var mm=require("./children/bar.js");
console.log(react.version);
mm.sayName1()
mm.menu()




 

./children/common.js
module.exports=alert("你在干嘛?");

 ./children/bar.js

var root = document.getElementById("root");

exports.sayName1 = function () {
    root.innerHTML = "我浊";
};
exports.menu = function () {
    var p = document.createElement("p");
    var pnode = document.createTextNode("这是一个新的段落");
    p.appendChild(pnode);
    root.appendChild(p);

}       

cmd>webpack --watch

测试吧 

转载于:https://www.cnblogs.com/alone2015/p/7667445.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值