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. HDU 1081 To the Max 最大子矩阵(动态规划求最大连续子序列和)

    Description Given a two-dimensional array of positive and negative integers, a sub-rectangle is any ...

  2. netty源码解析(4.0)-27 ByteBuf内存池:PoolArena-PoolThreadCache

    前面两章分析的PoolChunk和PoolSubpage,从功能上来说已经可以直接拿来用了.但直接使用这个两个类管理内存在高频分配/释放内存场景下会有性能问题,PoolChunk分配内存时算法复杂度最 ...

  3. navicat 12激活

    激活软件:https://github.com/DoubleLabyrinth/navicat-keygen/releases 激活说明:https://github.com/DoubleLabyri ...

  4. goweb-http协议

    先链接到一个我的另一篇有关HTTP的博客 第一次访问时会有些慢~~~ http协议 因为编写 Web 应用必须对 HTTP 有所了解,所以我们对 HTTP 进行介绍 HTTP 协议简介 HTTP 超文 ...

  5. flex下省略号的问题解决

    最近在搞微信小程序,发现flex下使用省略号是没有效果的,而且还会打乱预期的结构,查询statckoverflow知道需要在父级设置min-width:0; 但是在我的尝试下,依然不行,原来在上层父级 ...

  6. [20191108]内核参数tcp_keepalive与sqlnet.ora expire_time的一些总结.txt

    [20191108]内核参数tcp_keepalive与sqlnet.ora expire_time的一些总结.txt --//前几天在做12c DCD SQLNET.EXPIRE_TIME相关测试时 ...

  7. PHP的stdClass

    概述 以下是百度百科对php中的 stdClass的描述: stdClass在PHP5才开始被流行.而stdClass也是zend的一个保留类.stdClass类是PHP的一个内部保留类,初始时没有成 ...

  8. configparser读取配置文件时的相对路径问题

    学习接口测试时,当我把配置文件xx.config和读取配置文件的模块read_config.py放在项目下的同一个包config里时,只需传入文件名xx.config即可实现对配置文件的读取. 但是当 ...

  9. 设计模式-Composite(结构型模式) 用于 递归构建 树 状 的组合结构,与Decorator的区别是 Composite旨在通过构造子类而添加新操作,而Decorator直接添加新操作。

    以下代码来源: 设计模式精解-GoF 23种设计模式解析附C++实现源码 //Component.h #pragma once class Component { public: Component( ...

  10. iOS:捋一遍View的生命周期

    一.介绍 前面介绍了VC的生命周期,闲着没事也来捋一捋View的生命周期,简单用两个类型的View来监测.一个View纯代码创建,另一个View使用Xib创建. 二 .代码 MyCodeView:  ...