分析打包后的结果,看看打包后的结果是什么东西

把打包后的结果。注释什么的删删‘’

当前是一个匿名函数。

默认的时候会执行,执行的时候会传一个对象,对象有几部分,第一部分是我们的key。第二部分是我们的Value

之后就把这个对象传给了module

require默认是不能再浏览器中运行的,这里自己实现了一个方法叫做__webpack_require__参数传了一个moduleId

这个方法什么时候被调用的呢?在这里调用

帮我们把解析的所有模块变成对象,通过唯一的入口去加载我们这样一个东西

一次实现递归的依赖关系

修改配置文件名称

修改名字为:webpack.config.my.js

这里手动指定我们的配置文件

通过 --config执行配置文件的名称

npx wenpack --config webpack.config.my.js

配置脚本执行webpack

命令名字太长了。我们可以通过在package.json内配置一些脚本来执行webpack

scripts是一个固定的写法

build配置上webpack 它会自动的去node_modules下去找webpack命令

然后在后面加上--config 制定我们的配置文件的名称

这样我们执行npm run build就是执行npx webpack --config webpack.config.my.js相同的命令了

npm run +配置的scripts里面的命令,也就是build

下面这种是个错误的写法

如果你非要这么写的话,就在前面再加上一个 -- 这样就会认为后面是一个参数了。

把名字改回正常的名称:webpack.config.js

{
"name": "webpack-dev-1",
"version": "1.0.0",
"main": "index.js",
"license": "MIT",
"scripts": {
"build":"webpack --config webpack.config.js "
},
"devDependencies": {
"webpack": "^4.29.6",
"webpack-cli": "^3.3.0"
}
}

3、webpack打包出的文件解析的更多相关文章

  1. 为何webpack打包后的文件要放在服务器上才能运行

    为何会有此问: 在刚开始使用vue-cli时还不知道打包后的文件要在服务中才能运行,直接点开后发现页面白板,请教大神后得知要起一个服务才能运行起来,当时我脑子中的逻辑是这样的: 因为:js代码是由浏览 ...

  2. webpack 打包压缩 ES6文件报错UglifyJs + Unexpected token punc ((); 或者 Unexpected token: operator (>)

    webpack 打包压缩 ES6文件报错UglifyJs + Unexpected token punc (();  或者 Unexpected token: operator (>) 解决方案 ...

  3. webpack打包vue单文件组件

    一.vue单文件组件 ①文件扩展名为 .vue 的 就是single-file components(单文件组件) ②参考文档:单文件组件 二.webpack加载第三方包 ①项目中,如果需要用到一些第 ...

  4. webpack 打包出多个HTML文件,多个js文件,图片文件放置到指定文件夹中

    一.webpack.config.js简单代码 const HtmlWebpackPlugin = require('html-webpack-plugin'); module.exports = { ...

  5. webpack打包思路与流程解析

    一:创建一个新的工程,项目初始化 npm init -y 二:搭建项目框架 三:编写main.js文件内容,在index.js中引入,在把index.js引入到index.html中 例: expor ...

  6. webpack打包后的文件

    用了webpack打包工具,你是不是有时会疑惑,写了一个很简单的函数,结果生成那么多东西,而且还没有问题?下面,我从三种情况来分析打包后的入口文件,帮助自己理解webpack打包,也为平时定位产出目录 ...

  7. webpack打包去除map文件及其他一些配置

    一.vue-cli(3.x)搭建的项目,webpack(3.x)打包时,生成的map文件很大,目前又不知道是干嘛用的,所以就直接去掉了. 方法: 修改sourceMap配置成为false. 1:在bu ...

  8. vue-cli webpack打包不.map文件,iview 项目打包完,图标路径有问题

    vue 项目打包出来有时候体积有点大,其实基本都是.map文件比较大,这些文件对项目没什么影响,可以直接在打包时候就不生成.map文件这样就不用每次删那么麻烦了, 做法: config中知道 inde ...

  9. 前端(以Vue为例)webpack打包后dist文件包如何部署到django后台中

    由于现在前端使用的三大框架配合webpack可以实现快速打包,为部署到服务端提供了非常大的便利,那么在前端打包后,应该做些什么可以部署到django的后台中呢? 1.打包后文件包dist 进入到 di ...

随机推荐

  1. selector模块使用

    #服务端 from socket import * import selectors sel=selectors.DefaultSelector() def accept(server_fileobj ...

  2. iOS移动开发周报-第18期

    iOS移动开发周报_18期 [摘要]:本期iOS移动开发周报带来如下内容:苹果与 IBM 展开长期深度合作,Swift官方博客,Swift开发的视频教程等. 新闻 <苹果与 IBM 展开长期深度 ...

  3. pyquery模块

    pyquery 这个模块基本是仿JQuery的形式,也支持CSS选择器语法,因此对于爬虫来说,避免了正则表达式的滥用. 创建对象 from pyquery import PyQuery as pq d ...

  4. linux下解压命令大全(转载)

    转自:http://www.cnblogs.com/eoiioe/archive/2008/09/20/1294681.html .tar 解包:tar xvf FileName.tar打包:tar ...

  5. .Net 中的反射(动态创建类型实例)

    动态创建对象 在前面节中,我们先了解了反射,然后利用反射查看了类型信息,并学习了如何创建自定义特性,并利用反射来遍历它.可以说,前面三节,我们学习的都是反射是什么,在接下来的章节中,我们将学习反射可以 ...

  6. 富文本编辑器 - RichEditor

    基本功能 RichEditor 是一个继承自 WebView 的自己定义 view,枚举类型 Type 定了它所支持的排版格式: public enum Type { BOLD, ITALIC, SU ...

  7. ASP.NET MVC EXTJS 通用主菜单框架

    一.说明 首先我不知道定义的文章标题是不是准确,我这篇博文介绍的是一个通用的软件主菜单框架,界面布局用的是extjs,还是先上一个图吧. 软件主界面左侧菜单采用的风格是extjs的手风琴模式,需要注意 ...

  8. Grid++Report设置显示固定行数

    一.要实现的功能打印的报表显示固定的行数,并且设置字段的文字可以自动换行二.设置步骤1.鼠标左键单击“明细网格”栏,在右侧属性窗口中设置“追加空白行”属性值为:是:“追加空白行在后”属性值为:是.2. ...

  9. flume topology design . tier num 分层数目

    32:+:1 x:1 x<=8 https://flume.apache.org/FlumeUserGuide.html#flume-topology-design Flume topology ...

  10. appium(4)-Automating mobile web apps

    Automating mobile web apps If you’re interested in automating your web app in Mobile Safari on iOS o ...