1、全局安装

安装 webpack 前要确保已经下载 node.js 最新版本(node.js官网地址)

目前使用命令行安装的 webpack 默认为最新版本(以下我使用了全局安装。官网建议本地安装,这可以使我们在引入破坏式变更(breaking change)的依赖时,更容易分别升级项目。)

npm i webpack -g

当我想确认是否安装成功,输入 webpack -v 后出现:

One CLI for webpack must be installed. These are recommended choices, delivered as separate packages:
- webpack-cli (https://github.com/webpack/webpack-cli)
The original webpack full-featured CLI.
- webpack-command (https//github.com/webpack-contrib/webpack-command)
A lightweight, opinionated webpack CLI.
We will use "npm" to install the CLI via "npm install -D".
Which one do you like to install (webpack-cli/webpack-command):

提示我们必须安装一个 CLI,有两个版本,Windows 安装 webpack-cli ,Mac 安装 webpack-command,输入以下命令:

npm i webpack-cli -g//当前安装时的版本为3.0.8

然后再输入 webpack -v 确认是否安装成功:

webpack -v
4.16.0

至此,webpack4 才算安装完成(注意:如果 webpack 安装在全局,那么 CLI 也需要装在全局)。

webpack4以及以上版本的全局安装,直接执行以下命令:

npm install webpack webpack-cli –g

webpack的全局安装和局部

安装webpack,首先需要安装node,因为webpack依赖node环境,node自带了包管理工具npm;

查看node的版本号:

npm -v

全局安装webpack,这里安装3.6.0,主要使用vue cli2,-g表示全局安装;

npm i webpack@3.6.0 -g

局部安装使用:--save-dev是开发时依赖;

cd 项目目录

npm  i webpack@3.6.0  --save-dev
												

webpack4的安装使用的更多相关文章

  1. webpack4.0安装及使用(一)

    前言  1.什么是webpack 本质上,webpack 是一个现代 JavaScript 应用程序的静态模块打包器(module bundler).当 webpack 处理应用程序时,它会递归地构建 ...

  2. webpack4从安装到使用入过的那些坑

    1.全局安装 安装 webpack 前要确保已经下载 node.js 最新版本(node.js官网地址) 目前使用命令行安装的 webpack 默认为最新版本(以下我使用了全局安装.官网建议本地安装, ...

  3. webpack4.0在Mac下的安装配置及踩到的坑

    一.什么是webpack是一个前端资源加载/打包工具.它将根据模块的依赖关系进行静态分析,然后将这些模块按照指定的规则生成对应的静态资源.它做的事情是,分析你的项目结构,找到JavaScript模块以 ...

  4. webpack的正确安装方式

    webpack是基于node开发的模块打包工具,所以他本质上是由node实现的. 我们要保持node版本尽量的新,另一个要保持webpack版本尽量的新,高版本的webpack会利用新版本中的一些特性 ...

  5. 10分钟学会前端工程化(webpack4.0)

    一.概要 1.1.前端工程化 随着前端的不断发展与壮大,前端变得越来越复杂,组件化.模块化.工程化.自动化成了前端发展中不可或缺的一部分,具体到前端工程化,面临的问题是如何提高编码->测试-&g ...

  6. webpack4前端工程化教程(一)

    -本文作为webpack小白入门文章,会详细地介绍webpack的用途.具体的安装步骤.注意事项.一些基本的配置项,并且会以一个具体的项目实例来介绍如何使用webpack.另外,本文会简单地介绍一些最 ...

  7. webpack4.0.1安装问题和webpack.config.js的配置变化

    The CLI moved into a separate package: webpack-cli. Please install 'webpack-cli' in addition to webp ...

  8. [转]webpack4.0.1安装问题和webpack.config.js的配置变化

    本文转自:https://blog.csdn.net/jiang7701037/article/details/79403637 The CLI moved into a separate packa ...

  9. webpack4.0.1安装问题及解决方法

    2月底的时候,webpack4正式发布了,但是当我们安装之后,使用下面的语句来打包的时候,发现打包失败了 webpack ./src/main.js ./dist/bundle.js 并且给出了下面这 ...

随机推荐

  1. 口罩预约管理系统——系统网站实现(前端+PHP+MySQL)

    口罩预约管理系统网站实现 一.前言 二.系统登陆逻辑及界面实现 三.用户模块 1.用户预约系统界面 2.用户查看我的订单界面 3.用户修改预约信息 四.管理员模块 1.管理员登陆界面 2.查看用户预约 ...

  2. Spring学习(九)Spring 和数据库编程【了解】

    一.传统 JDBC 回顾 用一个大佬的demo来简单看一下 /** * 使用jdbc,根据id查询单个Student的信息 */ public class JdbcManage { public St ...

  3. linux中重启网卡后网络不通(NetworkManager篇)

    1.问题描述 RHEL7.6系统,使用nmcli绑定双网卡后,在使用以下命令重启network服务后主机网络异常,导致无法通过ssh远程登录系统. systemctl restart network ...

  4. Centos-将文件内容输出到标准输出-cat

    cat 将文件内容输出到标准输出 相关选项 -n 显示行号,包括空行 -b 显示行号,不包括空行 -A 显示制表符为 ^I ,结尾符为 $ 应用 1. 清空文件 cat /dev/null > ...

  5. 中心极限定理(为什么y服从高斯分布)

    因为每一条数据都服从IID原则: 根据中心极限定理,当数据增加的时候,样本均值的分布慢慢变成正态分布 不管分布式什么分布,累加起来都是高斯分布 As sum increases, sum of non ...

  6. Python练习题 049:Project Euler 022:姓名分值

    本题来自 Project Euler 第22题:https://projecteuler.net/problem=22 ''' Project Euler: Problem 22: Names sco ...

  7. 第二次UML作业

    博客班级 https://edu.cnblogs.com/campus/fzzcxy/2018SE1/ 作业要求 https://edu.cnblogs.com/campus/fzzcxy/2018S ...

  8. Linux 安装Navicat Premium 15

    参考:https://gitee.com/andisolo/navicat-keygen 安装 aptitude 管理软件 $ sudo apt-get install aptitude 安装Navi ...

  9. shiro入门学习--授权(Authorization)|筑基初期

    写在前面 经过前面的学习,我们了解了shiro中的认证流程,并且学会了如何通过自定义Realm实现应用程序的用户认证.在这篇文章当中,我们将学习shiro中的授权流程. 授权概述 这里的授权指的是授予 ...

  10. 对ACE和ATL积分

    下载source code - 39.66 KB 介绍 这篇文章展示了一种结合ACE和ATL的方法.它不打算作为功能演示,而是作为一个小型的"入门"解决方案,展示实现此目标的可行方 ...