webpack的一些简单操作
来源:互联网 发布:淘宝双十一数据统计 编辑:程序博客网 时间:2024/05/18 01:06
前提
安装一个全局的 webpack
npm install webpack -g
1.打包单个js文件
webpack 入口文件 输出文件
步骤
1.首先在当前文件目录下创建两个子文件夹:dist和src(这两个文件夹名字随意)
2.在src文件夹下创建一个js文件(例如index.js)
3.在dist目录下创建一个html文件
4.打开终端 输入 webpack ./src/index.js ./dist/bundle.js
5.在html文件里引入bundle.js文件
6.打包结束,运行html文件
2.打包多个具有依赖的关系的js文件
步骤
1.前面1,2,3步骤同打包单个js文件
2.在src文件下再创建一个demo.js,用module.exports导出文件
3.在index文件里定义一个变量接收require(‘./demo.js’)导出的值
4.剩下的步骤同打包单个js文件
3.打包.css结尾的文件
步骤
1.前面1,2,3步骤同打包单个js文件
2.在src文件下创建一个css文件,用require(‘!style-loader!css-loader!./index.css’)导入到index.js文件
3.npm install css-loader style-loader
4.剩下的步骤同打包单个js文件
本博客旨在供自己学习
参考文献webpack
阅读全文
0 0
- webpack的一些简单操作
- webpack简单的配置
- 一些简单的SQL操作
- 记事本的一些简单操作
- xml的 一些简单操作
- PS的一些简单操作
- 数据库的一些简单操作
- 栈的一些简单操作
- 二叉排序树的一些简单操作
- mysql的一些简单操作
- 矩阵的一些简单操作
- git的一些简单操作
- JQuery 一些简单的操作
- 堆的一些简单操作
- mongodb的一些简单操作
- 一些简单的操作符号
- Git的一些简单操作
- Git的一些简单操作
- Gogs与Linux主机共享SSH22端口
- 03-vueJs简介
- Python语言程序设计-学习笔记4:Python编程之数据类型
- linux基本操作---磁盘管理
- 关于JS中文档碎片的理解
- webpack的一些简单操作
- 浅析Java中通过ThreadLocal实现线程绑定来传递参数
- 吴恩达deeplearning之结构化机器学习—策略(1)
- 分治算法的简介
- sql2008r2安装失败
- malloc的基本实现
- UVALive 7263 Today Is a Rainy Day(BFS预处理)
- linux系统命令(一)用户与组
- 第三方APP实现QQ登陆