微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

【webpack】 初次使用

webpack是一个打包工具

 

首先安装环境

 

1、创建一个空项目

 

2、用IDEA打开(open)

 

3、创建modules文件夹,并在里面创建hello.js文件

hello.js

//暴露一个方法
exports.sayHi = function () {
    document.write('<h1>Hello</h1>')
};

然后创建main.js

var hello = require("./hello");

hello.sayHi();

 

4、创建webpack.config.js文件

module.exports={
    entry:'./modules/main.js',
    output:{
        filename:"./js/bundle.js"
    }
};

 

然后在下面的终端输入命令:webpack

此时,项目会多出一个文件dist

 

4、创建index.html文件,里面引入dist/js/bundle.js

<!DOCTYPE html>
<html lang="en">
<head>
    <Meta charset="UTF-8">
    <title>Title</title>
    
    <script src="dist/js/bundle.js"></script>
    
</head>
<body>

</body>
</html>

此时就可以打开网页观察结果了

 

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。

相关推荐