初探webpack之环境配置
先感叹一句,前端的发展真是太快了,ng和bb还没怎么学好就要过时了。现在感觉react当是未来的一个大方向。
以前一直用的grunt,不过前段时间作者已经停止更新了。正好webpack风头正盛,咱也不能落伍,也来看看webpack到底是有什么出色的地方。
1.要安装webpack,首先需要安装nodejs

安装nodejs,你可以挫下面的地址:https://nodejs.org/en/
下载完成以后就可以一直下一步安装了。我是安装在了d盘的根目录下
安装完成以后可以使用cmd输入命令查看是否安装成功。

再通过查看环境变量,我们可以看到下面的D:\nodejs\ 说明确实安装成功了

2.配置npm的路径
npm是nodejs的一个模块化管理工具,现在已经集成到nodejs中了,不需要再另外安装
我首先配置一下npm的全局存放路径以及缓存路径,我将两个文件夹建立在了nodejs的根目录下

启动cmd,键入如下的命令:
npm config set prefix "d:\nodejs\node_global"
npm config set cache "d:\nodejs\node_cache"
3.通过npm安装webpack
启动cmd,键入如下的命令:
npm install webpack -g

安装完成后信息如上:会显示安装的路径,版本号及目录结构等。
4.修改默认的node路径

新建一个NODE_PATH的键,输入你自己给定的全局存放路径

同样,用户变量中的PATH路径也要改成和NODE_PATH一直的路径
administrator中path添加d:\nodejs\node_global;
5.检测是否配置成功
以上的步骤全部完成以后,我们打开CMD,输入node,再键入require('webpack')

初探webpack之环境配置的更多相关文章
- react+webpack开发环境配置
react是目前非常热门的前端框架,提倡组件化开发.所谓的组件,简单理解,就是一个独立的页面部件(包括页面模版,样式,逻辑等),它是一个独立的整体. webpack,是一个模块打包工具,其主要功能,就 ...
- webpack开发环境配置和生产环境配置
开发环境配置 在开发环境下,我们首先考虑的是方便开发,方便代码调试,不需要考虑代码合并和css样式分离这些. 这里主要说三个 :1.css模块化:2.模块热替换功能:3.source-map(代码映射 ...
- vue2+webpack 开发环境配置
前提条件: 1.安装node.js https://nodejs.org/en/ 下载安装合适的平台 2.安装npm 第一步:初始化项目 新建文件夹 E:\app 推荐vue项目目录结构: confi ...
- vue2.0 + npm + webpack 开发===环境配置
cnpm安装:npm install -g cnpm --registry=http://registry.npm.taobao.org 1.安装vue-cli脚手架构建工具cnpm install ...
- VUE开发--环境配置(一)(转)
无剑_君关注 0.312019.05.09 11:53:43字数 1,073阅读 19,627 https://www.jianshu.com/p/a494417def99?utm_so ...
- 初探webpack之从零搭建Vue开发环境
初探webpack之搭建Vue开发环境 平时我们可以用vue-cli很方便地搭建Vue的开发环境,vue-cli确实是个好东西,让我们不需要关心webpack等一些繁杂的配置,然后直接开始写业务代码, ...
- 手把手教你webpack、react和node.js环境配置(上篇)
很多人刚学习react的时候,往往因为繁琐的配置而头疼,这里我将手把手教大家怎么用webpack配置react和redux的环境,这篇教程包括前端react和后台node整个网站的环境配置,对node ...
- 手把手教你webpack、react和node.js环境配置(下篇)
上篇我介绍了前端下webpack和react.redux等环境的配置,这篇将继续重点介绍后台node.js的配置. 这里是上篇链接:手把手教你webpack.react和node.js环境配置(上篇) ...
- React+ES6+Webpack环境配置
转自http://www.cnblogs.com/chenziyu-blog/p/5675086.html 参考http://www.tuicool.com/articles/BrAVv2y Reac ...
随机推荐
- Ajax库的编写及使用
ajax使用在服务器端. ajax.js function ajax(url,fnSucc,fnFail) { //1.创建ajax对象 var oAjax = null; if(window.XML ...
- Django——QuerySets酷毙了!
Django的QuerySets酷毙了! 在本文中我将解释一下QuerySets是什么,它是如何工作的(如果你对它已经熟悉了,你可以直接跳到第二部分),我认为如果可以的话你应该总是返回QuerySet ...
- openerp config file
[options] addons_path = /bin/openerp/addonsadmin_passwd = admincsv_internal_sep = , db_host = False ...
- hdu1010 dfs+路径剪枝
题意:用一个案例来解释 4 4 5 S.X. ..X. ..XD .... 在这个案例中,是一个4*4的地图. . 表示可走的地方, X 表示不可走的地方,S表示起始点,D表示目标点.没走到一个点之后 ...
- Log4net 根据日志类型输出日志
第一步:引入Log4net.dll 文件的引用 第二步:添加LogHelper类,代码如下 using System; using System.Collections.Generic; using ...
- NPM的天坑: 解决ERR! code UNABLE_TO_VERIFY_LEAF_SIGNATURE
各种下载失败,并不是镜像源的问题,哪怕切换淘宝源也无法下载.总之就像断网一般无法下载.无关网络. 解决方案: http://stackoverflow.com/questions/20747817/e ...
- Sql中的内连接,左连接以及右连接区别
转自:http://pangaoyuan.javaeye.com/blog/713177 有两个表A和表B. 表A结构如下: Aid:int:标识种子,主键,自增ID Aname:varchar 数据 ...
- C# 操作超时正常还是错
net(客户端)调用IIS(服务端)出现503后,就报操作超时错误 问题描述:服务端环境:IIS 客户端环境:windowsxp + iis + .net 调用时出现如下错误:System.Net.W ...
- C++语言基础(18)-模板
Java中的泛型编程可以极大的提升编程的效率,比如在android中查找一个控件的ID:标准写法为: TextView tv_text = (TextView)findViewById(R.id.tv ...
- valgrind的编译和使用
ubuntu 平台: valgrind 3.8.1 一. 编译 ./configure --prefix=/home/frank/test/valgrind/PC/local 报错:checking ...