码迷,mamicode.com
首页 > Web开发 > 详细

关于webpack的理解和npm的使用

时间:2018-08-21 10:49:42      阅读:234      评论:0      收藏:0      [点我收藏+]

标签:使用介绍   bsp   前端资源   vue   usr   一个   输入   cno   node.js   

Webpack 入门教程

Webpack 是一个前端资源加载/打包工具。它将根据模块的依赖关系进行静态分析,然后将这些模块按照指定的规则生成对应的静态资源。

从图中我们可以看出,Webpack 可以将多种静态资源 js、css、less 转换成一个静态文件,减少了页面的请求。

接下来我们简单为大家介绍 Webpack 的安装与使用。

 

安装 Webpack

在安装 Webpack 前,你本地环境需要支持 node.js

由于 npm 安装速度慢,本教程使用了淘宝的镜像及其命令 cnpm,安装使用介绍参照:使用淘宝 NPM 镜像

使用 cnpm 安装 webpack:

cnpm install webpack -g

 

NPM 使用介绍

NPM是随同NodeJS一起安装的包管理工具,能解决NodeJS代码部署上的很多问题,常见的使用场景有以下几种:

  • 允许用户从NPM服务器下载别人编写的第三方包到本地使用。
  • 允许用户从NPM服务器下载并安装别人编写的命令行程序到本地使用。
  • 允许用户将自己编写的包或命令行程序上传到NPM服务器供别人使用。

由于新版的nodejs已经集成了npm,所以之前npm也一并安装好了。同样可以通过输入 "npm -v" 来测试是否成功安装。命令如下,出现版本提示表示安装成功: 

$ npm -v
2.3.0

如果你安装的是旧版本的 npm,可以很容易得通过 npm 命令来升级,命令如下:

$ sudo npm install npm -g
/usr/local/bin/npm -> /usr/local/lib/node_modules/npm/bin/npm-cli.js
npm@2.14.2 /usr/local/lib/node_modules/npm

如果是 Window 系统使用以下命令即可:

npm install npm -g

使用淘宝镜像的命令:

cnpm install npm -g

  

 总结:

vue.js ----> 需要webpack打包 -----> 本地需要支持node.js ----> 利用淘宝镜像安装(npm命令)---->npm命令
是随同node.js一起安装的包管理工具

关于webpack的理解和npm的使用

标签:使用介绍   bsp   前端资源   vue   usr   一个   输入   cno   node.js   

原文地址:https://www.cnblogs.com/lchsirblog/p/9509501.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!