当前位置: 首页 > news >正文

Webpack 安装教程

Webpack 是一个前端资源加载/打包工具。

安装 Webpack

使用 cnpm 安装 webpack:

cnpm install webpack -g


创建项目
接下来我们创建一个目录 app:

mkdir app


在 app 目录下添加 runoob1.js 文件,代码如下:

app/runoob1.js 文件document.write("It dashu.");app/index.html 文件<html><head><meta charset="utf-8"></head><body><script type="text/javascript" src="bundle.js" charset="utf-8"></script></body>
</html>

接下来我们使用 webpack 命令来打包:

webpack dashu.js bundle.js

配置文件

app/webpack.config.js 文件
module.exports = {entry: "./dashu.js",output: {path: __dirname,filename: "bundle.js"},module: {loaders: [{ test: /\.css$/, loader: "style-loader!css-loader" }]}
};

插件

cnpm install webpack --save-dev

安装

cnpm install webpack-dev-server -g

运行

webpack-dev-server --progress --colors

http://www.lryc.cn/news/104652.html

相关文章:

  • 移远通信首批加入“5G+eSIM计算终端产业合作计划”,助力大屏移动终端全时在线
  • 全网最强大的工具箱—utools介绍及分享
  • Linux常用基础命令❀
  • SQL-进阶
  • [Pytorch]卷积运算conv2d
  • 主流开源监控系统一览
  • 爬虫原理详解及requests抓包工具用法介绍
  • tinkerCAD案例:31. 3D 基元形状简介
  • Vue2基础一、快速入门
  • 【POJ-3279】Fliptile(递推+搜索)
  • 522个matplotlib绘图案例,包含:折线图、散点图、条形图、饼图、直方图、3D图等,源码可直接运行!
  • windows安装Elasticsearch8.9.0
  • 用Delphi编写一个通用视频转换工具,让视频格式转换变得更简单
  • Kafka系列之:安装Know Streaming详细步骤
  • 绝杀 GETPOST 嵌套的 JSON 参数
  • Spring 项目过程及如何使用 Spring
  • 信息学奥赛一本通——1258:【例9.2】数字金字塔
  • selenium官网文档阅读总结(day 2)
  • VMware虚拟机安装VMware tools
  • 【Linux命令200例】rm用来删除文件或目录(谨慎使用)
  • 行云管家荣获CFS第十二届财经峰会 “2023产品科技创新奖”
  • uniapp禁止页面滚动
  • ModuleNotFoundError: No module named ‘_sqlite3‘
  • Rust的入门篇(下)
  • PYTHON-logging-工具类-支持中文字符控制台输出和文件写入-不会导致乱码
  • 对gpt的简单认识
  • java类和对象详解(1)
  • RxJava 倒计时,轮询器
  • SE-Net注意力机制
  • 【Lua学习笔记】Lua进阶——垃圾回收