• webpack起步


    webpack起步

    准备

    1. 安装nodejs

    2. 新建文件夹并并命名为todo;

    3. 进入到todo文件目录下

    4. npm init -y(npm初始化,在init的时候省去了敲回车的步骤,生成默认的packge.json)

    5. 安装webpack,webpack-cli(npm i --save-dev webpack webpack-cli)

    6. 在todo目录下新建以下内容

    7. npm i --save lodash

    8. 在src/index.js中编写以下内容

    	import _ from "lodash";
    	function component(){var element = document.createElement("div");
    		//lodash(目前通过一个script脚本引入)对于执行这一行是必须的
    		element.innerHTML = _.join(["Hello","webpack"],"");
    		return element;
    	}
    	document.body.appendChild(component());
    

    9.在index.html中编写以下内容

    	<!doctype html>
    	<html>
    		<head>
    			<title>起步</title>
    		</head>
    		<body>
    			<script src="main.js"></script>
    		</body>
    	</html>
    

    10.调整packge.json这个文件,一遍确保我们的安装包是私有的("private" : true),并且移除main入口

    11.执行npx webpack,会将我们的脚本作为入口起点,然后输出为main.js
    执行结果如图所示:

  • 相关阅读:
    汇编讲解(上)--逆向开发
    两数之和 II
    解析器模式--设计模式
    访问者模式--设计模式
    命令模式--设计模式
    ccf-201512-2 消除类游戏
    ccf-201503-2 数字排序
    移动端兼容和适配问题
    ccf-201409-2 画图
    ccf-201409-3 字符串匹配
  • 原文地址:https://www.cnblogs.com/dehenliu/p/12523013.html
Copyright © 2020-2023  润新知