webpack知识点散记
1、今天学习webpack ，刚开头就碰到了钉子，因为现在都是4+的版本，用以前的老命令不好使，如下例子及解决办法
不好用： webpack3的 打包文件 webpack a.js b.js
好用： webpack4 ：webpack --mode development a.js --output-filename b.js --out-path dist //a.js：目标文件 b.js ：要打包成的文件 dist：打包到的文件夹的名字
（1）app.js
//es
import sum from './sum' //common
var minus=require('./minus') //amd
require(['./muti.js'],function(muti){
console.log('*'+muti(2,5))
}) console.log('+'+sum(2,3))
console.log('-'+minus(5,2))
（2）sum.js
export default function (a,b){
return a+b
} （3）minus.js
module.exports=function(a,b){
return a-b
} （4）muti.js
define(function(require,factory){
'use strict';
return function(a,b){
return a*b
}
})
（5）index.html
<html>
<body>
<script src='dist/bundle.js'></script>
<script src='dist/0.bundle.js'></script>
</body>
</html>
（6）执行命令
webpack --demo development app.js --output-filename bundle.js --output-path dist
//话说webpack里要用module.exports
module.exports = {
entry:{
app:'./app.js' //入口
},
output:{
filename:'[name].[hash:5].js' //出口
}
}
文件名：webpack.conf.js
原命令：webpack --config webpack.conf.js
命令：webpack --mode development --config webpack.conf.js
文件名：webpack.config.js //如果文件夹名字是webpack.config.js 那么就不用--config + 名字了
原命令：webpack
命令：webpack --mode development
webpack知识点散记的更多相关文章
- webpack 知识点
安装 webpack npm install -g webpack npm install -g webpack-cli@2.x 初始化项目 npm init -y npm install --sav ...
- webpack 知识点总结
1 webpack 的不同点: 1.1 实现代码分割 1.2 loaders 1.3 plugin system 2 webpack 打包css,需要使用css-loaders 使webpack识别c ...
- webpack知识点整理
作用域 es6里模块化的写法 会存在的问题,变量.方法名字雷同,外部文件调用的时候出现问题 如 a.js里 var a='susan' b.js里 var a='jack' 问题解决方案,添加包裹 a ...
- vue知识点散记
1.iphone5微信浏览器里的methods里貌似不兼容 test(){} 写法,只支持test:function(){} 2.v-cloak 防止双括号的闪烁 <div id=" ...
- 深入浅出的webpack构建工具---webpack基本配置(一)
深入浅出的webpack构建工具---webpack基本配置(一) 阅读目录 一:webpack入门构建: 1. 安装webpack到全局 2. 安装webpack到本项目. 3. 如何使用webpa ...
- 深入理解webpack基本配置（一）
1. 安装webpack到全局 在学习构建之前,我们来在本地文件新建一个存放项目的文件夹,比如叫demo1这个项目,然后进入demo1该项目的根目录后,执行命令 npm init运行下,一路回车(先简 ...
- 深入了解webpack前，可以了解的小知识点。
阅读前:文章大概是写,简单用过webpack,想继续深入了解webpack前需要了解的知识.但文章内容跟webpack使用关系并不大. 文章概要: Object.defineProperty call ...
- webpack散记
1. manifest manifest存储了webpack的chunk相关的信息.具体为一个对象,或者包含runtime的一段代码.其中包含着一个chunkId,已经对应chunkId的相关信息,例 ...
- webpack 4 基础知识点梳理
目录 webpack安装 webpack配置文件 webpack核心概念 entry output loader plugins sourceMap webpack-dev-server 跨域 &am ...
随机推荐
- linux系统下安装两个或多个tomcat（转）
tomcat不用添加到环境变量中 直接解压两个tomcat 来到第二个tomcat的conf目录下 打开server.xml更改端口: 修改server.xml配置和第一个不同的启动.关闭监听端口 ...
- 如何在adapter 中调用activity的方法
如何在adapter 中调用activity的方法 2015-08-07 17:06匿名 | 浏览 808 次 iWorkjavaAndroid public class HistoryData e ...
- 移动互联网APP测试流程及测试点
1.2测试周期 测试周期可按项目的开发周期来确定测试时间,一般测试时间为两三周(即15个工作日),根据项目情况以及版本质量可适当缩短或延长测试时间.正式测试前先向主管确认项目排期. 1.3测试资源 测 ...
- Linux CentOS7 VMware find命令、文件名后缀
一.find命令 Linux系统中的 find 命令在查找文件时非常有用而且方便.它可以根据不同的条件来查找文件,例如权限.拥有者.修改日期/时间.文件大小等等.在这篇文章中,我们将学习如何使用 fi ...
- AngularJS1.X指令
<!DOCTYPE html> <html ng-app='myApp'> <head> <meta charset="utf-8"> ...
- Java安全中的“大坑”，跨平台真“浮云”
Java安全HttpDB 最近在做一个开源项目HttpDB,它的目标是在互联网中通过JDBC安全的查询数据库,解决云计算报表的数据库访问问题. 数据传输使用AES加密算法,用到了Java提供的安全库j ...
- Java读取压缩文件信息
不解压压缩文件,获取其中包含的文件,通过文件名检查是否包含非法文件.(后续再根据文件头或内容吧) zip: import java.util.zip.ZipEntry;import java.util ...
- 深度解析标点符号在Report写作中的应用
准确的标点符号和大写字母可以帮助Tutor准确理解report的意思.标点符号的某些方面,例如使用逗号,可以是一种个人风格,在引号中正确的标点符号是至关重要的.在前面的一些文章当中我们也给大家说了re ...
- 吴裕雄--天生自然JAVA数据库编程：PrepareStatement
import java.sql.Connection ; import java.sql.DriverManager ; import java.sql.SQLException ; import j ...
- [noip2014]P2312 解方程
P2312 解方程 其实这道题就是求一个1元n次方程在区间[1, m]上的整数解. 我们枚举[1, m]上的所有整数,带进多项式中看看结果是不是0即可. 这里有一个技巧就是秦九韶算法,请读者自行查看学 ...