前言


由于vue和react的流行,webpack这个模块化打包工具也已经成为热门。作为前端工程师这个需要不断更新自己技术库的职业,真的需要潜下心来学习一下。

准备工作(针对mac用户)

$ /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
  • 安装nodejs

$ brew install node
  • 安装 n 来管理 nodejs 版本

$ sudo npm install -g n
# 安装最新版本
$ n latest
# 安装最稳定版本
$ n stable
# 删除某个版本
$ n rm 0.10.1
# 切换版本
$ n
# 进入切换界面会出现当前安装的各个版本的nodejs
# 通过上下键切换版本,o切换到你想要的版本前回车即可

npm是随同nodejs一起安装的包管理工具,常见使用场景
1、允许用户从NPM服务器下载别人编写的第三方包到本地
2、允许用户从NPM服务器下载并安装别人编写的命令行程序到本地使用
3、允许用户将自己编写的包或命令行程勋上传到NPM服务器供别人使用

# 查看npm版本
$ npm -v
# npm升级
$ sudo npm install npm -g
# 在项目目录下初始一份package.json
$ npm init -y

准备工作就绪,下一章开始webpack学习。

学习webpack前的准备工作的更多相关文章

  1. 学习vue前的准备工作

    起步 1.扎实的HTML/CSS/Javascript基本功,这是前置条件. 2.不要用任何的构建项目工具,只用最简单的<script>,把教程里的例子模仿一遍,理解用法.不推荐上来就直接 ...

  2. 深入了解webpack前,可以了解的小知识点。

    阅读前:文章大概是写,简单用过webpack,想继续深入了解webpack前需要了解的知识.但文章内容跟webpack使用关系并不大. 文章概要: Object.defineProperty call ...

  3. 【Silverlight】Bing Maps学习系列(一):开发前的准备工作

    [Silverlight]Bing Maps学习系列(一):开发前的准备工作 微软推出的Bing Maps地图引擎,对外开放了Silverlight和Ajax两种客户端API,同时微软针对全球地图还推 ...

  4. 学习NGUI前的准备NGUI的相关信息

    学习NGUI前的准备NGUI的相关信息 第1章  学习NGUI前的准备 NGUI是Unity最重要的插件,在Unity资源商店(Asset Store)的付费排行榜中始终名列前茅,如图1-1所示.本章 ...

  5. webpack4 学习 --- webpack和webpack-dev-server

    以前了解过webpack2, 所以对webpack 不是很陌生,就直接入主题吧.新建一个文件夹,就叫它webpack-tut吧.然后在文件中新建一个src 文件夹,存放我们的源文件,再在src 文件夹 ...

  6. 深入学习webpack(二)

    深入学习webpack(二) 在深入学习webpack(一)中,我通过一个例子介绍了webpack的基本使用方法,下面将更为系统的学习webpack的基本概念,对于一门技术的掌握我认为系统化还是很重要 ...

  7. html5--6-68 实战前的准备工作:了解HTML5大纲算法

    html5--6-68 实战前的准备工作:了解HTML5大纲算法 学习要点 了解HTML5大纲算法 在html5中有一个很重要的概念,叫做HTML5大纲算法(HTML5 Outliner),它的用途为 ...

  8. <记录学习>(前三天)京东页面各种注意点

    培训学校第1到3天先学习HTML现在流行的是HTML5,目前学习的是HTML5规范.(给有基础一定的人学习)前三天学习的是京东页面的编写,和以前写的不同,页面看上去和自己写的一样,但老师讲的还是有很多 ...

  9. [译]开始学习webpack

    写在前面: 文章翻译自petehunt大神的petehunt/webpack-howto,作为学习webpack的开始.fork了一份,翻译后的在这里https://github.com/zjzhom ...

随机推荐

  1. docker入门-常用命令和网络

    一.常用命令 容器生命周期管理 run     运行一个容器 start/stop/restart  启动/停止/重启 kill   杀死一个容器 rm  删除一个容器 pause/unpause c ...

  2. 构造方法及方法(重载)与this关键字的使用

    一:构造方法的概念:             构造方法是一种特殊的方法,它是一个与类同名的方法.对象的创建就是通过构造方法来完成,其功能主要是完成对象的初始化.当类实例化一个对象时会自动调用构造方法. ...

  3. ComboBox控件绑定数据源后,添加'请选择'或'全部'

    ComboBox控件绑定数据源后,添加'请选择'或'全部' 当使用ComboBox控件绑定数据源之后,通过Items 属性添加的数据是无效的,此时如果要在所有选项前添加 选项 ,则需要考虑从数据源下手 ...

  4. selenium+python安装

    整理了下selenium+python环境搭建,搭建了很多次但每次都还是手忙脚乱,今天用心整理下 selenium 是用于测试 Web 应用程序用户界面 (UI) 的常用框架,并且 Selenium ...

  5. laravel报错 : laravel Please provide a valid cache path

    这是因为laravel的缓存路径没有找到 laravel缓存文件路径是在 config/cache.php中设置,默认存在storage文件夹中 'file' => [ 'driver' =&g ...

  6. 『现学现忘』Docker基础 — 22、使用Docker安装Nginx

    目录 步骤1:搜索镜像 步骤2:下载Nginx镜像 步骤3:运行Nginx镜像 步骤4:进行本机测试 步骤5:进入容器内操作 步骤6:测试外网访问容器 步骤1:搜索镜像 使用docker search ...

  7. Spring Session原理解析

    前景提要: @EnableRedisHttpSession导入RedisHttpSessionConfiguration.classⅠ.被RedisHttpSessionConfiguration继承 ...

  8. Java 8 + 10 = Java 18

    明天Java 18将正式发布, 虽然它不是长期支持 (LTS) 版本,但它却实现了九个 JEP(在Java 18列出).有哪些特性值得关注呢?今天胖哥为你提前解读.再看.点赞.转发.关注来一波吧. J ...

  9. 对 Kubernetes 部署进行故障排除的视觉指南

    链接:https://learnk8s.io/troubleshooting-deployments

  10. kafka 第一次小整理(草稿篇)————分发的基本思路[三]

    前言 简单整理一下分发的基本思路. 正文 kafka 原本是做日志管理系统,主要是分发这块的. 那么如何做分发呢? 分发的是什么呢? 分发的其实是日志,日志是事件状态,kafka 内部就叫做Recor ...