1.在cmd终端执行 npx webpack命令

2.在package.json文件同级建立webpack.config.js文件,内容如下:

const path = require('path');

module.exports = {
entry: './src/index.js', // 入口
output: { // 出口
filename: 'bundle.js', // 文件名
path: path.resolve(__dirname, 'dist') // 生成路径
}
};
执行命令 npx webpack --config webpack.config.js

3.修改package.json脚本
{
"name": "webpack-demo",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
+ "build": "webpack" // 修改命令执行方法
},
"keywords": [],
"author": "",
"license": "ISC",
"devDependencies": {
"webpack": "^4.0.1",
"webpack-cli": "^2.0.9",
"lodash": "^4.17.5"
}
}
执行命令npm run build

结论:生成类似下面的目录,打开index.html 有Hello webpack显示
webpack-demo
|- package.json
|- webpack.config.js
|- /dist
|- bundle.js
|- index.html
|- /src
|- index.js
|- /node_modules
 

window启动webpack打包的三种方法的更多相关文章

  1. Linux启动新进程的三种方法

    程序中,我们有时需要启动一个新的进程,来完成其他的工作.下面介绍了三种实现方法,以及这三种方法之间的区别. 1.system函数-调用shell进程,开启新进程system函数,是通过启动shell进 ...

  2. 获得Window窗口权限的三种方法

    1.第一种方法:利用视图控制器自带的View的window属性:  具体使用 self.view.window.rootViewController = ... 2.第二种方法:通过导入APPDele ...

  3. Linux 添加开机启动项的三种方法

    linux 添加开机启动项的三种方法. (1)编辑文件 /etc/rc.local 输入命令:vim /etc/rc.local 将出现类似如下的文本片段: #!/bin/sh## This scri ...

  4. 修改 VSS 默认登录用户名三种方法

    修改 VSS 默认登录用户名三种方法标签: VSS VSS2005c#2014-11-27 10:27 1561人阅读 评论(0) 收藏 举报 分类: VSS软件开发总会有 BUG 和更新的需求,之前 ...

  5. 服务器文档下载zip格式 SQL Server SQL分页查询 C#过滤html标签 EF 延时加载与死锁 在JS方法中返回多个值的三种方法(转载) IEnumerable,ICollection,IList接口问题 不吹不擂,你想要的Python面试都在这里了【315+道题】 基于mvc三层架构和ajax技术实现最简单的文件上传 事件管理

    服务器文档下载zip格式   刚好这次项目中遇到了这个东西,就来弄一下,挺简单的,但是前台调用的时候弄错了,浪费了大半天的时间,本人也是菜鸟一枚.开始吧.(MVC的) @using Rattan.Co ...

  6. Centos内核升级的三种方法

    本文出自 “存储之厨” 博客,请务必保留此出处http://xiamachao.blog.51cto.com/10580956/1755354 在基于CentOS平台的工作过程中,难免有时需要升级或者 ...

  7. Tomcat部署发布JSP应用程序的三种方法 (转)

    Tomcat部署发布JSP应用程序的三种方法     1.直接放到Webapps目录下      Tomcat的Webapps目录是Tomcat默认的应用目录,当服务器启动时,会加载所有这个目录下的应 ...

  8. java将doc文件转换为pdf文件的三种方法

    http://feifei.im/archives/93 —————————————————————————————————————————————— 项目要用到doc转pdf的功能,一番google ...

  9. Java Web开发中用Tomcat部署项目的三种方法

    第一种方法:在tomcat中的conf目录中,在server.xml中的,<host/>节点中添加: <Context path="/hello" docBase ...

随机推荐

  1. 【ASP.NET Core学习】入门

    下面操作都是基于VS Code,Net Core3.0 创建 Web 应用项目  VS Code终端输入 dotnet new webapp -o aspnetcoreapp 创建一个名称为aspne ...

  2. CSS定位和滚动条

    0805自我总结 一.绝对定位 position: absolute; /*绝对定位: 1.定位属性值:absolute 2.在页面中不再占位(浮起来了),就无法继承父级的宽度(必须自己自定义宽度) ...

  3. OAuth2、OpenID Connect简介

    当我们在登录一些网站的时候,需要第三方的登录.比如,现在我们要登录简书https://www.jianshu.com/sign_in,我们使用微博登录,点击下方的一个微博的小按钮,就会出现这么一个地址 ...

  4. Linux-shell学习笔记1

    1.检查 /etc/shells 这个文件可以得到有多少可用的shell,一般有一下几个: /bin/sh (已经被 /bin/bash 所取代) /bin/bash (就是 Linux 默认的 sh ...

  5. HTML基础——表格的应用

    一.表格标签 1.基本格式: 每个表格由 table 标签开始. 每个表格行由 tr 标签开始. 每个表格数据由 td 标签开始. 例如: <html> <head> < ...

  6. echarts关系图圆心颜色渐变

    let option = { backgroundColor: '#1a4377', animationDurationUpdate: 1500, // 动画更新变化时间 animationEasin ...

  7. Hadoop、storm和Spark Streaming简单介绍(非原创)

    文章大纲 一.Hadoop是什么二.storm是什么三.Spark Streaming是什么四.Spark与storm比较五.参考文章   一.Hadoop是什么 1. 简介 Hadoop是一个由Ap ...

  8. ORACLE等待事件:read by other session

    read by other session简介 官方关于read by other session的介绍如下: When information is requested from the datab ...

  9. 通过官网模板轻松实现Grafana的可视化界面配置(以MySQL监控项为例)

    我们知道可视化是监控的一个重要环节,所以往往我们这个环节花费大量的时间和精力.可是如果可以借鉴前辈的经验和成果,可以事半功倍.Grafana 有着非常漂亮的图表和布局展示,功能齐全的度量仪表盘和图形编 ...

  10. Redis分布式锁的实现原理

    原文链接:https://mp.weixin.qq.com/s/y_Uw3P2Ll7wvk_j5Fdlusw