前言


由于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. Qt:QTimer

    1.说明 QTimer类代表计时器,为了正确使用计时器,可以构造一个QTimer,将它的timeout()信号connect到合适的槽,之后调用start().然后,这个QTimer就会每隔inter ...

  2. 基于JQuery打造无缝滚动新闻

    JQuery实现 新闻无缝滚动 一.使用"首尾追加"实现无缝滚动 <head lang="en"> <meta charset="U ...

  3. 【算法】经典的ML算法(后续结合工作实践完善心得)

    18大数据挖掘的经典算法以及代码实现,涉及到了决策分类,聚类,链接挖掘,关联挖掘,模式挖掘等等方面,后面都是相应算法的博文链接,希望能够帮助大家学.目前追加了其他的一些经典的DM算法,在others的 ...

  4. TP5实现多文件上传及展示

    view层上传: <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

  5. MRS IoTDB时序数据库的总体架构设计与实现

    MRS IoTDB时序数据库的总体架构设计与实现 MRS IoTDB是华为FusionInsight MRS大数据套件最新推出的时序数据库产品,其领先的设计理念在时序数据库领域展现出越来越强大的竞争力 ...

  6. 详解Nacos 配置中心客户端配置缓存动态更新的源码实现

    Nacos 作为配置中心,当应用程序去访问Nacos动态获取配置源之后,会缓存到本地内存以及磁盘中. 由于Nacos作为动态配置中心,意味着后续配置变更之后需要让所有相关的客户端感知,并更新本地内存! ...

  7. vue 通信:父子通信、兄弟通信、跨多层通信、vuex状态管理

    之前简单做了一次vue通信方法的培训,在此记录一下培训的内容. 关于vue通信,大家最先想到的方法应该是props.ref.$emit.$parent,还有vuex,因为这也是我在项目中最常用到的方法 ...

  8. 使用socat反向Shell多台机器

    原创:打码日记(微信公众号ID:codelogs),欢迎分享,转载请保留出处. 场景 很多时候,我们需要批量操作多台机器,业界一般使用Ansible来实现,但使用Ansible来操作多台机器的前提是需 ...

  9. Spring Boot 中初始化资源的几种方式

    假设有这么一个需求,要求在项目启动过程中,完成线程池的初始化,加密证书加载等功能,你会怎么做?如果没想好答案,请接着往下看.今天介绍几种在Spring Boot中进行资源初始化的方式,帮助大家解决和回 ...

  10. Java8 中的流式数据处理

    java8的流式处理极大了简化我们对于集合.数组等结构的操作,让我们可以以函数式的思想去操作,本篇文章将探讨java8的流式数据处理的基本使用. 一. 流式处理简介 在我接触到java8流式处理的时候 ...