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. 基于Centos 搭建Jenkins环境

    ⒈简介 Jenkins 是一个开源软件项目,是基于Java开发的一种持续集成工具,用于监控持续重复的工作,旨在提供一个开放易用的软件平台,使软件的持续集成变成可能. ⒉Java安装 首先我们需要准备 ...

  2. ffmpeg AVFrame结构体及其相关函数

    0. 简介 AVFrame中存储的是原始数据(例如视频的YUV, RGB, 音频的PCM), 此外还包含了一些相关的信息, 例如: 解码的时候存储了宏块类型表, QP表, 运动矢量等数据. 编码的时候 ...

  3. PAT A1058 A+B in Hogwarts (20)

    AC代码 #include <cstdio> struct Money { long long Galleon, Sicklke, Knut; }A, B, Sum; void init( ...

  4. MyBatis 体系结构、根配置文件、Mapper映射文件

    一.MyBatis的体系结构 1.SqlSessionFactory对象 SqlSessionFactory对象是MyBatis的管理核心,它是单个数据库映射关系经过编译后的内存镜像,是创建SqlSe ...

  5. jquery.validate.js表单验证 jquery.validate.js的用法

    jquery.validate.js这个插件已经用了2年多了,是一个不可多得的表单验证最方便快捷的插件.基于jquery的小插件,基本小白一学就会上手,对于项目表单页面比较多,元素比较多的校验,该插件 ...

  6. c语言测试芯片好坏

    问题描述有n个(2<n<20)芯片,好的或坏的,并且有比坏的芯片更多的已知的好的芯片.每个芯片都可以用来测试其他芯片.当用一个好的芯片测试其他芯片时,它可以正确地给出被测芯片是好是坏.当用 ...

  7. 搭建vue.js 的npm脚手架

    1.在cmd中,找到nodeJs安装的路径下,运行 vue -V,查看当前vue版本,如下图所示,表明已经安装过了. 2.没有安装,进行安装.在cmd中,找到nodeJs安装的路径下,运命令行 npm ...

  8. Excel中把图片合并进图表的方法介绍

    方法一: 使用“图案”对话框 双击某个数据系列,选择“图案”标签,单击“填充效果”按钮,在“填充效果”对话框中选择“图片”标签,单击“选择图片”按钮,选择一个要使用的图形文件即可. 方法二: 使用剪贴 ...

  9. powershell查看版本信息

    在终端输入$PSVersionTable

  10. PostMan 中使用Datas 文件一次Run 只能使用一个

    PostMan 一次run  只能有一个文件. Note that you can only use one data file for one run.