webpack 简单使用
yarn init
yarn add webpack --dev
yarn global add live-serveryarn 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/shortidwebpack 简单使用的更多相关文章
- 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版本 ...
随机推荐
- Enumerable的判断是否包含某个元素
// 通过使用默认的相等比较器(即纯粹的对象比较)确定序列是否包含指定的元素. public static bool Contains<TSource>(this IEnumerable& ...
- 使用lock锁或Monitor.Enter的目的
锁定的目的:由于多个线程 并行/并发 处理同一个“数据对象”(比如:在其它线程的某个地方发生了Clear.Add.Remove.Change等操作),导致“数据对象”不断变化,没法用了,所以,为了保证 ...
- 解决Tomcat加载时报APR错的问题
部署Tomcat的时候出现了如下错误, INFO: The APR based Apache Tomcat Native library which allows optimal performanc ...
- NOIP2018小反思
今天下午做了一道叫邮票 Stamps的题.敲代码的时候就发现,好像和去年D1T2货币系统有点像,原理都是一个完全背包DP.做完之后交上去发现有几个点RE了,于是马上把数组改大,AC. 我赶忙找到去年那 ...
- 十九 Python分布式爬虫打造搜索引擎Scrapy精讲—css选择器
css选择器 1. 2. 3. ::attr()获取元素属性,css选择器 ::text获取标签文本 举例: extract_first('')获取过滤后的数据,返回字符串,有一个默认参数,也就是如 ...
- spoj-ANARC05H -dp
ANARC05H - Chop Ahoy! Revisited! #dynamic-programming Given a non-empty string composed of digits on ...
- h1标签
h1标签一.每个网页只能拥有一个<H1>标签 H2,H3,H4可以有多个...但多个H1造成的后果是搜索引擎不知道你这个页面哪个标题内容最重要,会淡化这个页面的标题和关键词.H1用得好的话 ...
- datagrid与DropDownList关联使用
最近做一个页面需要用到这个两个控件,之前虽然看过,但是没有动手实践过.突然要做这么一个页面,并用上,真的有点着急.于是乎,网上疯狂找datagrid与DropDownList 的例子,找了很多很多,看 ...
- DRF中五大扩展类及视图集的介绍
五个扩展类 (1)ListModelMixin 列表视图扩展类,提供list(request, *args, **kwargs)方法快速实现列表视图,返回200状态码. 该Mixin的list方法会对 ...
- 左边的div导航根据右部div内容的高自动调整
div结构如下: <div class="mainbody"> <div class="left">导航</div> < ...