专栏首页coding for love2-3 webpack的正确安装方式

2-3 webpack的正确安装方式

1. 简介

搭建webpack环境

2. 安装node

webpack是基于node开发的环境打包工具。首先需要安装node环境。 进入node官网,尽量安装最新版本的稳定版node。因为提高webpack打包速度有两个重要的点:

  1. 安装尽量高版本的node
  2. 安装尽量高版本的webpack 高版本的webpack会引入高版本node的一些新的特性,来提升我们的打包速度。

3.示例

mkdir webpack-demo
npm init  // 生成package.json
// 可以在package.json加入一行"private": true 说明项目为私有,不会发布到npm库

4. 安装webpack

推荐在项目内部安装webpack。

npm install webpack webpacl-cli -D // 会生成node_modules文件夹
// 也可以指定版本安装
npm install webpack@4.25.0 webpack-cli -D
// 可以找历史版本
npm info webpack

非全局安装时,要运行webpack,需要加npx,来帮助我们在当前项目目录下的node_modules内的webpack。

npx webpack -v

使得我们在不同项目中使用不要同版本的webpack

引申

了解package.json中的每一项

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 2-4 使用webpack的配置文件

    之所以直接执行npx webpack index.js就能打包成功,是由于webpack内置了配置文件。 尝试直接运行npx webpack会报错,因为web...

    love丁酥酥
  • 5-10~11 webpack 性能优化(2)

    然后我们修改一下 home.jsx 代码,增加一个三方库,lodash。我们装一下 lodash 然后引入:

    love丁酥酥
  • 3-8 使用 WebpackdevServer 提升开发效率

    webpack-dev-server 是 webpack 集成的开发者服务器,用于帮助开发者快速开发应用程序。

    love丁酥酥
  • 走近webpack(0)--正文之前的故事

      在前端工作的过程中,只要你接触过vue,angular,react,gulp就一定知道webpack或者听说过或者使用过webpack,但是或许你对webp...

    zaking
  • Webpack第一天

    Webpack是什么?我觉得我没必要再介绍了,相信开发前端的都知道现在webpack在前端所占的地位。Webpack就是一个模块打包工具,帮我们转换代码、压缩文...

    wade
  • webpack3新特性简介

    6月20号webpack推出了3.0版本,官方也发布了公告。根据公告介绍,webpack团队将未来版本的改动聚焦在社区提出的功能需求,同时将保持一个快速、稳定的...

    用户1217459
  • 【先行者】webpack学习笔记(节选)

    在打包的时候,输入 webpack --model=development或production,

    web前端教室
  • Webpack 4正式发布!从0配置到生产模式,你需要知道的都在这里了

    为中大型项目提供webpack的配置并不是什么大问题。 然而,对于较小的项目来说,这很麻烦,特别是当你想要启动一些玩具应用时。

    疯狂的技术宅
  • webpack安装异常

    webpack中文指南:https://zhaoda.net/webpack-handbook/index.html

    Dawnzhang
  • Webpack 实战入门系列(三):生产配置、样式文件分离及输出清理

    现在vue、react很流行,新项目基本用这些新框架,组件化开发确实是趋势,但是他们再怎么发展也离不开构建工具,顶多在webpack等工具上进行再封装。现在vu...

    一只图雀

扫码关注云+社区

领取腾讯云代金券