现在js发展太快了,根本看不懂啊。于是乎想做做功课,于是乎看到了这些“奇怪”的写法,原来好多都是遵循了 ECMASCRIPT6,好吧,在本地看看怎么用的吧。写在本地的环境下,

发现各种报错,根本不能用。还在纳闷呢,这个例子是怎么能写成这个样,还在那教人的呢?误人子弟?怎么跑呢?各种搜索才发现,原来我们一般常用的js是遵循的ES5规范,由于浏览器

支持等各种原因,我们需要将最新的ES6语法变成ES5才能以我们熟知的方式运行。于是乎,针对ES6的就出现了很多打包工具。webpack就是其中一款。

  现在知道了,这个是干嘛的(当然写这篇文章的时候,我还是不怎么明白这些东西之间的关系)。我们先安装吧。 幸好在很久很久以前,我安装过node了,那么npm工具我也装过了。没

装过npm的自行百度吧。声明一点,我是在win7的环境下安装的。windows研究node你懂得,各种报错到爆炸,再加上根本不懂这些东西,所以各种无解的错误,让人奔溃。

  好了,言归正传,那我们开始安装吧!我假定 你像我一样拥有了 npm

  安装 webpack,以全局的方式安装:

1
$ npm install webpack -g

  然而,我并不喜欢这种方式,因为并不是所有的项目都需要webpack的。通常我们会将 Webpack 安装到项目的依赖中,这样就可以使用项目本地版本的 Webpack。

1
2
3
4
# 进入项目目录
# 确定已经有 package.json,没有就通过 npm init 创建
# 安装 webpack 依赖
$ npm install webpack --save-dev

  

  补充一点吧:像我一样对package.json 各种参数了解很水的。可以自己百度一下package.json各个参数的意思。我放出一个可用的吧:

package.json

1
2
3
4
5
6
7
8
9
10
{
  "name""demo",
  "version""0.0.1",
  "dependencies": {
    "webpack""latest"
  },
  "devDependencies": {
    "webpack""^1.14.0"
  }
}

  安装的过程中可能会很慢,一直卡在那转圈。原因你懂得,我们上的是一个局域网,外面的世界不是你想看就能看的。。。。。如果你像我一样,不能FQ,那你就先

暂停吧。执行下面的语句:

1
npm config set registry https://registry.npm.taobao.org

  用一下国内的良心镜像。你会发现再执行 npm install webpack --save-dev 会很快的安装完毕。安装完成之后,你会发现,项目中多了一个 node_modules文件夹

里面有一个 .bin和webpack文件夹。此时我们打开终端,输入 webpack会提示 webpak不是内部命令。不用怕,因为这个执行文件在你的项目下的 node_modules\.bin

下面,只要将这个路径配入 环境变量的 path中去 ,就可以愉快的使用 webpack了!

局部安装webpack时,使用webpack命令时提示webpack不是内部命令解决方法的更多相关文章

  1. jquery-easyui的datagrid在checkbox多选时,行选中不正确应,去除高亮的解决方法

    jquery-easyui的datagrid在checkbox多选时,行选中不正确应,去除高亮的解决方法 工作中用到一个具有多选功能的easyui-datagrid在处理cell的点击事件时,不同 ...

  2. vi命令【方向键】变字母键的解决方法

    vi命令[方向键]变字母键的解决方法   最近在SSH下玩Debian发现了一个有趣的现象,就是在一些个别版本的Debian镜像下,使用vi命令时会出现键盘输出出错的现象,使用方向键时会变成C,D等字 ...

  3. 【pycharm】pycharm上安装tensorflow,报错:AttributeError: module 'pip' has no attribute 'main' 解决方法

    pycharm上安装tensorflow,报错:AttributeError: module 'pip' has no attribute 'main' 解决方法 解决方法: 在pycharm的安装目 ...

  4. webstorm和git安装后,terminal输入git命令,提示'git' 不是内部或外部命令

    最近换了工作,拿到电脑重新搭建编程环境,踩了好多git和sourcetree的坑,就是一直拉不下来代码,晕·~~经过几天的爬坑,终于可以拉取推送代码了!!! 问题:webstorm和git都安装完成, ...

  5. vue-cli创建的webpack工程中引用ExtractTextPlugin导致css背景图设置无效的解决方法

    当我们用vue-cli创建项目后,如果在我们的template模板文件中的css样式设置中,有设置了background-image的属性,并且url值传入的是相对路径,那么当我们在打包生产代码时,w ...

  6. 执行PHP脚本时遇到 mysql_connect(): Headers and client library minor version mismatch的解决方法

    把服务器从Windows迁移到了centos7.2,配置好PHP运行环境后,项目运行正常. 但在命令行中运行一个PHP脚本时,遇到了标题中显示的错误 使用 php -i | grep Client 得 ...

  7. imp导入时 出现IMP-00017:由于 ORACLE 错误 6550, 以下语句失败: 解决方法

    cmd命令下--执行imp命令时,出现IMP-00017:由于 ORACLE 错误 6550, 以下语句失败: 解决办法:在imp命令里加入 statistics=none (不导入数据库统计信息) ...

  8. 【Azure 应用服务】PHP应用部署在App Service for Linux环境中,上传文件大于1MB时,遇见了413 Request Entity Too Large 错误的解决方法

    问题描述 在PHP项目部署在App Service后,上传文件如果大于1MB就会遇见 413 Request Entity Too Large 的问题. 问题解决 目前这个问题,首先需要分析应用所在的 ...

  9. 安卓(android)建立项目时失败,出现Android Manifest.xml file missing几种解决方法?(总结中)

    安卓(android)建立项目时失败.出现AndroidManifest.xml file missing几种解决方法?(总结中) Eclipse新建项目.遇到这种问题.注意例如以下: 1.文件名称最 ...

  10. DreamWeaver文件保存时,提示"发生共享违例"问题的解决方法

    在学习牛腩老师的JS视频中,视频中的例子要求实现一个是23个3相乘的结果,在用Dreamweaver制作时,, <script language="javascript" t ...

随机推荐

  1. JAVA and JAVA WEB with TOMCAT and ECLIPSE 学习过程中遇到的字符乱码问题及解决方法汇总(随时补充)

    JAVA语言具有跨平台,unicode字符集编码的特点. 但是在开发过程中处理数据时涉及到的字符编码问题零零散散,尤其是处理中文字符时一不留神就可能出现一堆奇奇怪怪的符号,俗称乱码. 对于乱码,究其原 ...

  2. 《Effective Java》第6章 枚举和注解

    第30条:用enum代替int常量 将加班工资计算移到一个私有的嵌套枚举中,将这个策略枚举(strategy enum)的实例传到PayrollDay枚举的构造器中.之后PayrollDay枚举将加班 ...

  3. 《Head First Servlets & JSP》-11-Web应用部署

    Web目录 WAR文件 WAR文件只是Web应用结构的一个快照,采用了一种更可移植的压缩形式. 建立WAR文件时,就是把整个Web应用结构(去掉Web应用上下文目录,就是把WEB-INF之上的一级目录 ...

  4. c#中public,private,protected,internal的区别

    public   可以被外部成员调用  private   只能在被类的成员调用   protected   只能在被类的成员和该类的子类调用   internal   可以在当前项目调用   pub ...

  5. TCP/IP与套接字

    以前我们讲过进程间通信,通过进程间通信可以实现同一台计算机上不同的进程之间通信. 通过网络编程可以实现在网络中的各个计算机之间的通信. 进程能够使用套接字实现和其他进程或者其他计算机通信. 同样的套接 ...

  6. Boot Option Menu

    SATA HDD:TOSHIBA MQ02ABF100    1000G SATA HDD:SAMSUNG MZVLW512HMJP-000L2   => Invalid Partition T ...

  7. xml文件绑定chenckbox选择框

    //xml文件如下: <?xml version="1.0" encoding="utf-8" ?> <CallReson> <! ...

  8. Python3中集合的混合使用

    比较简单没什么好说的: list_1 = [1,2,3,4,6,3,2,5,7,8,2,1] list_1 = set(list_1) list_1.add(999) list_2 = set([2, ...

  9. A - Chips

    Gerald plays the following game. He has a checkered field of size n × n cells, where m various cells ...

  10. laravel5.2总结--返回值

    基本概念和概述 1>StdClass 对象=>基础的对象 2>Eloquent 模型对象(Model 对象)=>和模型相关的类对象 3>Eloquent 集合=>可 ...