webpack--第一个demo(一)

た入场券 2021-09-18 13:44 528阅读 0赞

## 目录结构 ##

![clipboard.png][]

## 项目初始化 ##

初始化不成功的原因

1.  node版本
2.  网络原因
3.  权限(mac,linux),sudo cnpm install

npm init -y
    cnpm install webpack --save-dev

## dist/index.html ##

<div id="title"></div>
        <script src="./bundle.js"></script>

## src/entery.js ##

document.getElementById('title').innerHTML = "hello";

## 打包 ##

webpack 入口文件 出口文件

webpack src/entery.js dist/bundle.js

打包后的结果

![clipboard.png][clipboard.png 1]  
打包后在bundle.js中的位置

![clipboard.png][clipboard.png 2]

## 开启本地服务器 ##

cnpm install live-server -g
    live-server

![clipboard.png][clipboard.png 3]

![clipboard.png][clipboard.png 4]

[clipboard.png]: /images/20210726/cfc97d8f725a4630bd4b7dd38daa04ac.png
[clipboard.png 1]: /images/20210726/0c6013747bbd49f3b349d270b09cea0f.png
[clipboard.png 2]: /images/20210726/092296a1144e4e0593c6b9fa1b53fc71.png
[clipboard.png 3]: /images/20210726/bf5f19bd5f2346f7aeaf60ddb27466fb.png
[clipboard.png 4]: /images/20210726/5eb75550c24f4cacba04aa4aaad08e39.png

发表评论取消回复

表情：

评论列表（有 0 条评论，528人围观）

还没有评论，来说两句吧...

相关阅读

相关第一个spring小demo

工作中用spring有一年多了，基本弄懂了bean配置文件的配置，但是却没有对spring配置文件，加载有更多的认识，今天动手写了第一个spring的小

清疚/ 2022年08月07日 11:39/ 0 赞/ 302 阅读

相关第一个ajax小demo

之前转过两篇[ajax][]的文章，今天终于自己动手写了一个ajax的小demo，体验一下ajax的神奇之处，记录下来，纯属个人学习代码，分享给初学的朋友们。

谁践踏了优雅/ 2022年08月07日 07:47/ 0 赞/ 288 阅读

相关 SpringBoot安装起步，第一个Demo

首先准备环境，IntelliJ IDEA 这个编辑器真不错，之前我一直使用eclipse，第一次使用这个编辑器来写项目，感觉还不错。 ![Center][] 创建完毕

妖狐艹你老母/ 2022年06月15日 12:19/ 0 赞/ 314 阅读

相关 Springboot+Thymeleaf 第一个Demo

Thymeleaf 简介 Thymeleaf 和Freemarker，Velocity 一样，是Springboot 大力支持的三种模板语言之一。它可以完全替代JSP，事

╰+哭是因爲堅強的太久メ/ 2022年05月18日 07:30/ 0 赞/ 290 阅读

相关 SpringMVC学习笔记（一）——第一个Demo(helloworld)

jar包 ![70][] 项目预览图 ![70 1][] web.xml配置： <?xml version="1.0" encoding="UTF-8"?>

向右看齐/ 2022年05月15日 11:40/ 0 赞/ 387 阅读

相关 spring boot 第一个demo

适合初学者，第一次使用idea，第一次使用springboot，springboot与之前一直使用的spring相比简单太多，只需要配置application.xml 或者ym

布满荆棘的人生/ 2022年04月15日 06:10/ 0 赞/ 376 阅读

相关 flask学习第一节第一个demo程序

今天刚开始学习flask 本篇博客仅仅记录自己当天所学内容总结对于用不用虚拟环境这个都可以但是这里建议用，毕竟别人的python或者flask版本较多，所以最好还是

电玩女神/ 2022年01月30日 03:57/ 0 赞/ 425 阅读

相关 Selenium自动化测试第一个demo

1，自动化在Google浏览器中访问百度，并获取百度的title from selenium import webdriver \Google驱动 browse =

迈不过友情╰/ 2021年09月24日 08:42/ 0 赞/ 505 阅读

相关 webpack--第一个demo(一)

目录结构 ![clipboard.png][] 项目初始化初始化不成功的原因 1. node版本 2. 网络原因 3. 权限(mac,linux),su

た入场券/ 2021年09月18日 13:44/ 0 赞/ 529 阅读

相关 Protobuf3 系列一第一个Java demo

概念 > Protocol buffers are a flexible, efficient, automated mechanism for serializing

客官°小女子只卖身不卖艺/ 2021年06月24日 14:37/ 0 赞/ 435 阅读