webpack.config.js
Posted 记录下自己走过前端的坑~
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了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
测试吧
以上是关于webpack.config.js的主要内容,如果未能解决你的问题,请参考以下文章
webpack教程——webpack.config.js文件
在 vue-cli 3.0 如何生成完整的 webpack.config.js
webpack配置之webpack.config.js文件配置
入口点 - webpack.config.js vs vue.config.js