webpack（二）：webpack安装

最新推荐文章于 2022-11-08 23:22:35 发布
最新推荐文章于 2022-11-08 23:22:35 发布
阅读量169 收藏
点赞数
分类专栏： webpack 文章标签： webpack
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/wangdongm123/article/details/104003842
版权

  webpack为了可以正常运行，必须依赖node环境，node环境为了可以正常的执行很多代码，必须其中包含各种依赖的包，而npm工具（node packages manager）就是管理各种依赖的包。
  所以，安装webpack首先需要安装Node.js，Node.js自带了软件包管理工具npm。
2.1node.js 的官方下载地址
2.2查看自己的node版本
2.3全局安装webpack
2.4局部安装webpack

2.1node.js 的官方下载地址

https://nodejs.org/en/download/

2.2查看自己的node版本

node -v
在这里插入图片描述

2.3全局安装webpack

(这里先指定版本号3.6.0，因为vue cli2依赖该版本)
npm install webpack@3.6.0 -g
在这里插入图片描述
-g表示全局安装

2.4局部安装webpack（后续才需要）

–save-dev`是开发时依赖，项目打包后不需要继续使用的。
在这里插入图片描述
为什么全局安装后，还需要局部安装呢？
在终端直接执行webpack命令，使用的全局安装的webpack
当在package.json中定义了scripts时，其中包含了webpack命令，那么使用的是局部webpack
参考文档

wangdongm123
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
webpack安装与使用
weixin_38654336的博客
06-27 2219
webpack介绍：WebPack可以看做是模块打包机：它做的事情是，分析你的项目结构，找到JavaScript模块以及其它的一些浏览器不能直接运行的拓展语言（Scss，TypeScript等），并将其打包为合适的格式以供浏览器使用。一、先上node.js上下载node.js稳定版二、一路next安装好node.js之后是这样子的（记得路径根据自己的需要来配置好）三、window+R进入cmd命令...
webpack播放：了解webpack
02-05
### 二、Webpack 工作流程 1. **初始化**：Webpack 读取配置文件，解析入口起点，开始构建模块依赖图。 2. **模块编译**：Webpack 使用 Loaders 将非 JavaScript 模块转化为可执行的 JavaScript 代码。 3. **依赖图...
webpack局部版本安装、打包
Monkey
03-14 1710
webpack局部版本安装、打包 Webpack有两种安装方式： 全局安装：安装Webpack到全局后，可以在任何地方共用一个Webpack可执行文件，而不用各个项目重复安装。 局部安装：（推荐）安装到某个项目中，可防止不同项目依赖不同版本的 Webpack 而导致冲突。 此处不对全局安装进行论述。 局部安装 Webpack 1、新建项目空白目录，并运行 npm init –y 命令，初始化包管理配置文件 package.json； 2、创建src源代码目录，程序代码在此目录下进行维护 3、执行 n
npm 安装 局部webpack
qq_51644702的博客
05-10 1580
首先查看Node.js是否安装完成 node -v npm -v 安装webpack 疑问：在这里，我们为什么不进行全局安装？ 全局安装后，会造成多个项目依赖同一版本，但是有时候我们想要的是不同版本的，因此不推荐全局安装 步骤： 1、在你需要打包的项目文件夹中，打开cmd：win7下 shift+右键，在命令行中打开，win10还需要在Powershell中输入start cmd 2、初始化npm npm init 一直回车 3、局部安..
配置es6环境，webpack局部安装
aliven1的博客
12-24 286
1.在文件夹根目录初始化，npm init,生产json文件； 2.npm install --save-dev webpack@3.6.0 (-D==--save-dev) 此时webpack还不能用，必须修改环境变量的path: 1.我的电脑=>右键属性=> 点确定配置完成； 这个时候检查webpack是否安装完成，可能依然报类似错误：...
webpack局部安装的问题
weixin_30399821的博客
02-28 293
webpack的局部安装 npm install webpack 默认状态是当前目录下安装，-g是全局安装 ----------------------------------------------------------------------------- 由于webpack版本更新的问题 npm install webpack 默认安装的是最新版本，会出现如下问题 ...
未使用文件webpack插件：在webpack的上下文中查看所有未由webpack编译的文件
02-06
未使用的文件webpack插件 在webpack的上下文中显示所有非由webpack编译的文件 使用npm安装： npm i --save-dev unused-files-webpack-plugin 用纱安装： yarn add --dev unused-files-webpack-plugin 用法 ...
webpack：:scroll:一些节点教程-《 Webpack学习笔记》
02-06
Webpack 是一个流行的模块打包工具，尤其在前端开发中被广泛使用。它允许开发者将JavaScript、CSS、图片等资源组织成模块，并将它们打包成一个或多个可部署的静态资源。在学习Webpack的过程中，掌握以下几个核心概念...
webpackVue:webpackVue
04-28
- 首先，你需要在项目根目录下通过 npm (Node.js 包管理器) 安装 Webpack 和 Webpack CLI： ``` npm init -y npm install --save-dev webpack webpack-cli ``` - 接着，创建一个 `webpack.config.js` 文件来...
webpack样板：最小的webpack样板
02-05
安装依赖项npm install 启动服务器npm start 在浏览器中导航到localhost:3500 请享用！ 注意：使用节点版本> 10 内容 Webpack 5 ES6支持 Sass支持 热点模块重新加载-每当js或cs // scss文件更改时，浏览器就会...
nodejs8.9.4(安装包)_npm_webpack_vue-cli安装详解.zip
06-27
nodejs8.9.4_npm_webpack_vue-cli安装详解 里面有详细的安装步骤
webpack安装部分
qishensaigao的博客
07-16 377
1.安装node.js，并设置环境变量 2.全局安装  npm install webpack webpack-cli -g或淘宝镜像cnpm install webpack webpack-cli -g 3.进入你要做的项目，在你的项目里生成npm init 4. 局部安装cnpm install webpack webpack-cli -S 5.打包  webpack 6.因为web...
NodeJS+Webpack入门：从安装到使用
lgxzzz的博客
12-15 654
目录 前言： 1.NodeJS 1.1 NodeJS安装 1.2 修改NodeJS安装模块路径： ​1.3 配置镜像源: 2.Webpack 2.1 Webpack安装 本地安装（推荐）： 全局安装： 2.2 Webpack打包 手动打包： 热部署： 前言： 这是一篇从后端开发人员的视角出发，编写的关于NodeJS和Webpack从零开始，从安装到使用的记录，基本上每一步都有注释说明，...
Node.js最新最详细安装教程（2020）
热门推荐
蜡笔小柯南的博客
03-19 20万+
2020最新-Node.js详细安装教程（2020）
webpack命令局部运行的几种方法
weixin_30699831的博客
02-26 226
webpack命令局部运行的几种方法 1. 第一种，先全局安装webpack 命令：npm install -g webpack 然后再在项目内安装 命令：npm install webpack --save-dev 这样在项目内就可以直接使用webpack命令了，运行的却是局部的webpack 2.第二种，直接在局部安装webpack，利用package.json设置中的...
webpack局部安装、配置与使用时的报错记录与解决方案
最新发布
weixin_67665876的博客
11-08 2625
新手webpack配置时，容易遇到的Bug合集。
webpack局部安装-v报错的问题
weixin_30469385的博客
06-12 1150
局部安装的webpack ，由于是4.0版本以上 ， 也安装了webpaci -cli 问题在于，我想着以前都是npm i -g ， 然后直接webpack -v就可以测试是否正式安装成功，但这一次，因为项目版本不同(并且全局安装本来就不是好习惯)，删掉了原来的全局webpack，重新在项目下安装了。 npm i webpack webpack-cli -D 然后webpac...
关于如何使用局部安装的webpack的三种方法
qq_51025561的博客
02-22 955
关于如何使用局部安装的webpack的方法
12-安装node.js和webpack的完整步骤
书启鸿蒙知秋枫
10-01 2535
【代码】安装webpack的完整步骤。
Webpack入门：核心概念与依赖机制详解
Webpack 是一款强大的前端构建工具，它被设计用于现代 JavaScript 应用程序的模块打包。本篇文章将带你深入了解 webpack 的基础概念以及其在前端工程化中的关键作用。 首先，我们从webpack 的核心概念入手。Webpack...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值