打包JS

Step1:在新建的文件夹下新建一个sum.js文件,一个app.js文件

sum.js

//es module
export default function(a,b){
return a+b;
}

minus.js

//CommmonJS
module.export = function(a,b){
return a+b
}

app.js引入sum模块

//es module
import sum from './sum'
//commonJS
var minus = require('./minus') console.log('sum(23,24) =' , sum(23,24));

打包运行,app.js是需要打包的函数,而bundle.js是打包之后生成模块的文件,webpack 版本更改后有一点不一样(后续更新)

webpack app.js bundle.js

webpack学习3.1由浅入深-打包JS的更多相关文章

  1. webpack学习(六)打包压缩js和css

    打包压缩js与css 由于webpack本身集成了UglifyJS插件(webpack.optimize.UglifyJsPlugin)来完成对JS与CSS的压缩混淆,无需引用额外的插件, 其命令we ...

  2. webpack学习(七)打包压缩图片

    使用插件webpack-spritesmith生成雪碧图 1.安装webpack-spritesmith:npm install --save-dev webpack-spritesmith 2.配置 ...

  3. webpack学习2.1 模块化开发(JS模块化&CSS模块化)

    一.JS模块化 命名空间,COMMONJS,AMD/CMD/UMD,ES6 module 1.什么是命名空间 库名.类别名.方法名 弊端:在命名空间重复生命,要记住完整的路径名(而且很长) var N ...

  4. 简单学习【1】——打包JS

    webpack entry <entry> output webpack --config webpack.conf.js Step1:新建一个文件,里面有一个app.js 一个sum.j ...

  5. webpack学习(一)安装和命令行、一次js/css的打包体验及不同版本错误

    一.前言 找了一个视频教程开始学习webpack,跟着视频学习,在自己的实际操作中发现,出现了很多问题.基本上都是因为版本的原因而导致,自己看的视频是基于webpack 1.x版,而自己现在早已是we ...

  6. webpack学习笔记一:安装webpack、webpack-dev-server、内存加载js和html文件、loader处理非js文件

    一 .webpack学习环境准备: 1:window系统 2:安装node.js  官方网址 下载好后下一步下一步安装即可 安装步骤略过....... 3:nrm的安装 打开cmd命令控制台 输入:n ...

  7. 使用webpack打包js文件(隔行变色案例)

    使用webpack打包js文件(隔行变色案例) 1.webpack安装的两种方式 运行npm i webpack -g全局安装webpack,这样就能在全局使用webpack的命令 在项目根目录中运行 ...

  8. 配置webpack中externals来减少打包后vendor.js的体积

    在日常的项目开发中,我们会用到各种第三方库来提高效率,但随之带来的问题就是打包后的vendor.js体积过大,导致加载时空白页时间过长,给用户的体验太差.为此我们需要减少vendor.js的体积,从本 ...

  9. webpack打包js,css和图片

    1.webpack打包默认配置文件webpack.config.js 2.打包js文件:有这个文件并配置可以直接在cmd上webpack打包,没有这个文件要在cmd上输入 webpack main.j ...

随机推荐

  1. mac软件推荐及chrome插件推荐

    通用软件 Alfred (超级好用的效率工具) 用mac这个软件一定要装,用习惯之后加上电脑本身的快捷键.效率提升的飞起. Alfred我常使用的功能有: 搜索chrome的书签 我搜索的书签大概分为 ...

  2. MySQL通过自定义函数实现递归查询父级ID或者子级ID

    背 景: 在MySQL中如果是有限的层次,比如我们事先如果可以确定这个树的最大深度, 那么所有节点为根的树的深度均不会超过树的最大深度,则我们可以直接通过left join来实现. 但很多时候我们是无 ...

  3. MySQL基础知识面试与答案

    1.Mysql 的存储引擎,myisam和innodb的区别. 答: 1.MyISAM 是非事务的存储引擎,适合用于频繁查询的应用.表锁,不会出现死锁,适合小数据,小并发. 2.innodb是支持事务 ...

  4. css三大特效之层叠性

    css三大特效之层叠性

  5. scrapy自动抓取蛋壳公寓最新房源信息并存入sql数据库

    利用scrapy抓取蛋壳公寓上的房源信息,以北京市为例,目标url:https://www.dankegongyu.com/room/bj 思路分析 每次更新最新消息,都是在第一页上显示,因此考虑隔一 ...

  6. .NET Core 跨平台 GUI 开发之 GTtkSharp 初级篇

    .NET Core 跨平台 GUI 开发之 GTtkSharp 初级篇 本文作为初级篇,适合已经安装好.NET Core 环境以及 Gtk 环境,并具备了 C#开发基础知识,能跑一些简单的例子,希望更 ...

  7. centos7忘记root密码的重置方法-超简单

    忘记root密码,重置root密码8步. 1.在开机界面按e进入grub编辑模式 2.找到 ro修改为rw /sysroot/bin/sh 3.Ctrl + x 启动 4.chroot /sysroo ...

  8. 实现springboot对接腾讯云短信

    1,导入pom依赖 <dependency> <groupId>com.github.qcloudsms</groupId> <artifactId>q ...

  9. PAT(甲级)2019年秋季考试

    第一题用搜索,超时了,待补 更新第一题思路 dfs + 剪枝,首先确定 n的最后一位数字肯定是9,为什么呢,因为 任意两个相邻的数肯定互为质数(gcd=1),所以 n 的末尾肯定是9,这样n+1产生的 ...

  10. HBase(2) Java 操作 HBase 教程

    目录 一.简介 二.hbase-client 引入 三.连接操作 四.表操作 五.运行测试 FAQ 参考文档 一.简介 在上一篇文章 HBase 基础入门 中,我们已经介绍了 HBase 的一些基本概 ...