webpack学习3.1由浅入深-打包JS
打包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的更多相关文章
- webpack学习(六)打包压缩js和css
打包压缩js与css 由于webpack本身集成了UglifyJS插件(webpack.optimize.UglifyJsPlugin)来完成对JS与CSS的压缩混淆,无需引用额外的插件, 其命令we ...
- webpack学习(七)打包压缩图片
使用插件webpack-spritesmith生成雪碧图 1.安装webpack-spritesmith:npm install --save-dev webpack-spritesmith 2.配置 ...
- webpack学习2.1 模块化开发(JS模块化&CSS模块化)
一.JS模块化 命名空间,COMMONJS,AMD/CMD/UMD,ES6 module 1.什么是命名空间 库名.类别名.方法名 弊端:在命名空间重复生命,要记住完整的路径名(而且很长) var N ...
- 简单学习【1】——打包JS
webpack entry <entry> output webpack --config webpack.conf.js Step1:新建一个文件,里面有一个app.js 一个sum.j ...
- webpack学习(一)安装和命令行、一次js/css的打包体验及不同版本错误
一.前言 找了一个视频教程开始学习webpack,跟着视频学习,在自己的实际操作中发现,出现了很多问题.基本上都是因为版本的原因而导致,自己看的视频是基于webpack 1.x版,而自己现在早已是we ...
- webpack学习笔记一:安装webpack、webpack-dev-server、内存加载js和html文件、loader处理非js文件
一 .webpack学习环境准备: 1:window系统 2:安装node.js 官方网址 下载好后下一步下一步安装即可 安装步骤略过....... 3:nrm的安装 打开cmd命令控制台 输入:n ...
- 使用webpack打包js文件(隔行变色案例)
使用webpack打包js文件(隔行变色案例) 1.webpack安装的两种方式 运行npm i webpack -g全局安装webpack,这样就能在全局使用webpack的命令 在项目根目录中运行 ...
- 配置webpack中externals来减少打包后vendor.js的体积
在日常的项目开发中,我们会用到各种第三方库来提高效率,但随之带来的问题就是打包后的vendor.js体积过大,导致加载时空白页时间过长,给用户的体验太差.为此我们需要减少vendor.js的体积,从本 ...
- webpack打包js,css和图片
1.webpack打包默认配置文件webpack.config.js 2.打包js文件:有这个文件并配置可以直接在cmd上webpack打包,没有这个文件要在cmd上输入 webpack main.j ...
随机推荐
- Centos下安装PHP ldap扩展
Centos下安装PHP ldap扩展,有两种方法,仅供参考. 一.在线安装 执行下面命令: 1 yum install PHP-ldap 可能出现的问题: Error: php70w-common- ...
- 百度杯 black_hole复现
在这次复现中,经历了太多挫折. 刚刚开始的时候本地调试 get不到shell,就很疑问,而且不会爆破,想学下怎么爆破出那个0x05, 后来问了位师傅 ,他说用retdl_solve 试试,我就跑去学了 ...
- PyQt5的安装及测试(pycharm)
参考链接:https://www.cnblogs.com/pywjh/articles/9835931.html https://blog.csdn.net/SeekAndFindYou/ar ...
- 02_Pandas基本使用
1.Pandas读取数据 一般错误 import pandas as pd pd.read_csv(r'D:\数据分析\02_Pandas\pandas\food_info.csv') out: -- ...
- iptables简单命令
IPTables是基于Netfilter基本架构实现的一个可扩展的数据报高级管理系统或核外配置工具,利用table.chain.rule三级来存储数据报的各种规则.Netfilter-iptables ...
- Glibc编译报错:*** LD_LIBRARY_PATH shouldn't contain the current directory when*** building glibc. Please change the environment variable
执行glibc编译出错如下图 [root@localhost tmpdir]# ../configure --prefix=/usr/loacl/glibc2.9 --disable-profile ...
- Android分包MultiDex源码分析
转载请标明出处:http://blog.csdn.net/shensky711/article/details/52845661 本文出自: [HansChen的博客] 概述 Android开发者应该 ...
- 附011.Kubernetes-DNS及搭建
一 Kubernetes DNS介绍 1.1 Kubernetes DNS发展 作为服务发现机制的基本功能,在集群内需要能够通过服务名对服务进行访问,因此需要一个集群范围内的DNS服务来完成从服务名到 ...
- java Math类常用方法
package com.niuke.test; public class MathDemo { public static void main(String args[]){ /** * abs求绝对 ...
- P1307 数字反转
题目描述 给定一个整数,请将该数各个位上数字反转得到一个新数.新数也应满足整数的常见形式,即除非给定的原数为零,否则反转后得到的新数的最高位数字不应为零(参见样例2). 输入输出格式 输入格式: 一个 ...