webpack 简单使用
yarn init
yarn add webpack --dev
yarn global add live-server
yarn add shoritd
├── index.html
├── main.js
├── package.json
├── show.js
├── webpack.config.js
└── yarn.lock
<html>
<body>
<div id="app"></div>
<script src="./dist/bundle.js"></script>
</body>
</html>
function demo(content){
window.document.getElementById("app").innerText="this is a demo"+content;
}
module.exports=demo;
const shortid = require("shortid");
const demo = require("./show.js");
demo(shortid.generate());
const path = require("path");
module.exports = {
entry:"./main.js",
output:{
filename:"bundle.js",
path:path.resolve(__dirname,"./dist"),
}
}
yarn run build

https://webpack.github.io/
https://www.npmjs.com/package/shortid
webpack 简单使用的更多相关文章
- webpack简单原理及用法
前言 如果你已经对Webpack精通了或者至少一直在工作中使用它,请关闭当前浏览器标签,无视这篇文章. 这篇文章本意是写给我自己看的,作为一篇Cookbook供快速查询和上手用.原因是虽然工作中会涉及 ...
- vue-cli安装以及创建一个简单的项目(一)(Node\npm\webpack简单使用)
1.关系介绍 1.简单的说 Node.js 就是运行在服务端的 JavaScript. 2.NPM是随同NodeJS一起安装的包管理工具(新版的nodejs已经集成了npm),能解决NodeJS代码部 ...
- webpack 简单笔记(一)
安装部分不介绍了 (一)第一个最简单的demo,单入口,单文件 目录结构: webapck.config.js中代码: 'use strict' const path = require('path' ...
- webpack简单笔记
本文简单记录学习webpack3.0的笔记,已备日后查阅.节省查阅文档时间 安装 可以使用npm安装 //全局安装 npm install -g webpack //安装到项目目录 npm insta ...
- webpack 简单配置
webpack.config.js const path = require('path'); const HtmlWebpackPlugin=require('html-webpack-plugin ...
- webpack简单教程
1.初始化 安装node后,新建一个目录,比如html5.cmd中切到当前文件夹. npm init -y 这个命令会创建一个默认的package.json.它包含了项目的一些配置参数,通过它可以进行 ...
- webpack简单修改版本号(单页面)
写了一个js文件,可以尽量最简单的修改版本号 package.json配置: updateV.js放置位置: updateV.js: var fs = require('fs'); //文件读写 va ...
- webpack简单的打包体验
怎么使用webpack 进行打包 需要使用管理员权限进行安装 npm install webpack -g npm install webpack-cli -g 创建站点 mkdir webpack ...
- webpack简单学习的入门教程
前言,如果按照官网的安装办法: npm install webpack -g 安装的是最新版的,然后就莫名其妙的有问题(可以安装,但运行有问题).我是小白,我也不知道具体原因,所以我换成2.5.1版本 ...
随机推荐
- spring mvc: 属性方法名称解析器(多动作控制器)MultiActionController/ControllerClassNameHandlerMapping/PropertiesMethodNameResolver
spring mvc: 属性方法名称解析器(多动作控制器) 加入控制器是StudentContrller.java,里面有3个方法 index,add,remove 那么访问地址是: http://l ...
- jQuery 中$.ajax()方法参数详解
$.ajax({ url:'test.do', data:{id:,name:'xiaoming'}, type:'post', dataType:'json', success:function(d ...
- mvc 获取 HtmlHelper 表达式值
public static MvcHtmlString Try<TModel, TProperty>( this HtmlHelper<TModel> htmlHelper, ...
- cat 命令|more命令|less命令
cat主要有三大功能:1.一次显示整个文件:cat [-n] filename2.从键盘创建一个文件:cat > filename 3.将几个文件合并为一个文件:cat file1 file2 ...
- Pandas:时间数据的季节分析
最近在做论文的数据处理,涉及到不同年份不同季节的分析.另外还要求不同季节的数据可以单独分析. 其实思路还是比较简单的,那就在原始数据中增加一栏:季节 2013-05-21 Aotizhongxin 1 ...
- Java 进阶7 并发优化 5 并发控制板方法
Java 进阶7 并发优化 5 并发控制板方法 20131114 前言: Java 中多线程并发程序中存在线程安全的问题,之前学习 Java的同步机制,掌握的同步方法只有一种就是使用 ...
- SpringInAction--面向切片的Spring以及如何使用注解创建切面
什么叫做切片..什么叫做AOP... 与大多数技术一样,AOP已经形成了自己的术语.描述切面的常用术语有通知(advice).切点(pointcut)和连接点(join point). (一大串书上的 ...
- 20165202 实验一 Java开发环境的熟悉
一.实验内容及步骤 (一)使用JDK编译.运行简单的Java程序 建立"自己学号exp1"的目录 mkdir 20165202exp1 进入目录 cd 20165202exp1 在 ...
- 20165210 《网络对抗技术》week1 exp0 kali安装与配置
20165210 <网络对抗技术>week1 exp0 kali安装与配置 1. 安装过程: 从kali官网上下载如下图所示: 下载完成后打开VMware 点击创建新的虚拟机 弹出新虚拟机 ...
- MetaPost使用
简介 MetaPost是一种制图语言,由John D. Hobby开发. 如果你要学习它,可以去下面的网址看看. 官网:http://tug.org/metapost 权威手册:http://tug. ...