1、步骤

　　1）运行npm init -y 快速初始化项目

　　2）在项目根目录创建src源代码目录和dist产品目录，目录结构

webpack4.x-base

    |dist

    |src

        |index.html

        |index.js

　　3）安装webpack:

cnpm i webpack webpack-cli -D

　　4）在项目根目录下创建webpack.config.js, 由于webpack4.x约定大于配置，默认入口就是src/index.js，出口dist/main.js

module.exports = {

    mode: 'development' // development  production

};

　　

2、项目结构

　　index.html

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <title>主页</title>

    <script src="../dist/main.js"></script>

</head>

<body>

</body>

</html>

创建基本的webpack4.x项目的更多相关文章

  1. IntelliJ IDEA 14.x 与 Tomcat 集成，创建并运行Java Web项目

    转自:http://www.php-note.com/article/detail/854 IntelliJ IDEA 14.x 与 Tomcat 集成,创建并运行Java Web项目 作者:php- ...

  2. 通过beego快速创建一个Restful风格API项目及API文档自动化

    通过beego快速创建一个Restful风格API项目及API文档自动化 本文演示如何快速(一分钟内,不写一行代码)的根据数据库及表创建一个Restful风格的API项目,及提供便于在线测试API的界 ...

  3. 使用Visual Studio 创建新的Web Part项目

    使用Visual Studio 创建新的Web Part项目 Web Part是你将为SharePoint创建的最常见的对象之中的一个.它是平台构建的核心基块. 1. 管理员身份打开Visual St ...

  4. eclipse创建Maven父子结构Maven项目

    1.创建聚合模块 选择菜单项 File—>New—>Other,在弹出的对话框中选择Maven下的Maven Project,然后单击Next按钮,在弹出的New Maven Projec ...

  5. .net core CLI(创建VueJS||Angular结合的项目)

    net core cli 是快速创建模板项目 安装CLI 参考: https://www.hanselman.com/blog/dotnetNewAngularAndDotnetNewReact.as ...

  6. Linux搭建GIT 使用Eclipse创建并上传Git项目 EGit操作

    Linux搭建Git 1. gitblit服务器文档 http://gitblit.com/setup_go.html 2. 安装jdk 参考 http://blog.csdn.net/jerome_ ...

  7. IntelliJ IDEA 创建Spring+SpringMVC+mybatis+maven项目

    参考自:https://www.cnblogs.com/hackyo/p/6646051.html 第一步: 创建maven项目 输入项目名和工程id 选择maven 默认就可以了 刚开始时间比较长, ...

  8. Intellij IDEA创建git,maven的SpringMVC项目

    Intellij IDEA创建git,maven的SpringMVC项目 原文链接:http://www.cnblogs.com/blog5277/p/8906120.html 原文作者:博客园--曲 ...

  9. maven创建父子关系的聚合项目

    我最近使用eclipse的mavean插件创建父子关系的聚合项目,如果创建子工程直接在父工程我相信大家都会创建,但是子工程在父工程中的其中一个文件夹里面,我们创建子工程是直接存在父工程下面的,当我们想 ...

随机推荐

  1. Spring 循环依赖的三种方式（三级缓存解决Set循环依赖问题）

    本篇文章解决以下问题: [1] . Spring循环依赖指的是什么? [2] . Spring能解决哪种情况的循环依赖?不能解决哪种情况? [3] . Spring能解决的循环依赖原理(三级缓存) 一 ...

  2. 【Redis】Redis持久化

    Redis数据持久化 Redis的特性: 易扩展,大数据高性能,多样灵活的数据模型,受限内存 Redis默认端口: 6379 Redis数据持久化分为有两种: RDB: 每隔一段时间就把内存数据写入磁 ...

  3. 模仿ORM

    ORM 对象关系映射 类 ---------->映射--------->    表 对象 ------>映射---------->   一条记录 对象点属性 --->映射 ...

  4. django时区与时间差的问题

    时区的正确配置方式: # 这里还可以配置成中文 一般用不到 LANGUAGE_CODE = 'en-us' # TIME_ZONE = 'UTC' TIME_ZONE = 'Asia/Shanghai ...

  5. Java 时间不一致

    1.new Date() 得到的时间?和系统相差 相差8个小时 2.eclipse控制台打印的时间与系统相差 相差8个小时 3.log4j日志的时间与与系统相差 相差8个小时 上述问题其实是同一个问题 ...

  6. QT获取屏幕分表率（PC、安卓）

    QRect screenRect = QGuiApplication::primaryScreen()->geometry(); double devicePixelRatio = QGuiAp ...

  7. Ubuntu 忘记系统登录密码，如何修改密码

    Ubuntu 忘记系统登录密码,如何修改密码. 1.重新启动,按ESC键进入Boot Menu,选择recovery mode(一般是第二个选项). 2.在#号提示符下用cat /etc/shadow ...

  8. JSTreeShaking的webpack-deep-scope-plugin插件的应用

    webpack自身实现词法分析的JSTreeShaking webpack-depp-scope-plugin插件实现作用域分析的JSTreeShaking 一.webpack词法分析的JSTreeS ...

  9. JS中数组与对象的遍历方法实例小结

    一.数组的遍历: 首先定义一个数组 1 arr=['snow','bran','king','nightking']; 1.for循环,需要知道数组的长度; 2.foreach,没有返回值,可以不知道 ...

  10. 第二十五篇 jQuery 学习7 获取并设置 CSS 类

    jQuery 学习7 获取并设置 CSS 类   jQuery动态控制页面,那么什么是动态呢?我们就说一下静态,静态几乎又纯html+css完成,就是刷新页面之后,不会再出现什么变动,一个实打实的静态 ...