1.先确保安装了最新版的Node.js和NPM,并已经了解NPM的基本用法

(以下使用cmd命令行进行)

2.安装webpack

  (1)全局安装

    $ npm install webpack -g

    (1)局部安装

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

    # 进入项目目录

    # 确定已经有 package.json,没有就通过 npm init 创建

     # 安装 webpack 依赖
     $ npm install webpack --save-dev
  (--save-dev会作为开发依赖来安装webpack。安装成功之后,在 package.json中会多一项配置
    
    )
3.安装webpack-dev-server(它可以在开发环境中提供很多服务,比如启动一个服务器、热更新、接口代理等)
  $ npm install webpack-dev-server --save-dev
  安装完成之后,最终的package.json文件内容为:
  

如果你的devDependencies中包含webpack和webpack-dev-server,恭喜你,已经安装成功!

使用webpack---安装webpack和webpack-dev-server的更多相关文章

  1. 解决新版本webpack vue-cli生成文件没有dev.server.js问题

    新版本webpack生成的dev.server.js 在webpack.dev.conf.js中 webpack.dev.conf.js const axios = require('axios') ...

  2. 前端自动化构建工具webpack (一)之webpack安装 和 设置webpack.confi.js

    目的:  模块化开发,组件化开发,让代码符合开发规范,更高效 webpack作用:从pack,就知道这是包的意思,比较专业点叫做前端自动化打包构建工具,代码错误检查,预处理,文件合并(打包),代码压缩 ...

  3. 笔记:配置 webpack dev server

    笔记:配置 webpack dev server 安装 webpack-dev-server 组件 配置 webpack.config.js 配置 增加 html-webpack-plugin 组件 ...

  4. 配置Webpack Dev Server 实战操作方法步骤

    本文摘要:配置 Webpack Dev Server 可以解决本地开发前端应用时,手动执行 webpack 命令或 yarn build 命令,再去浏览器中访问 dist/index.html 的麻烦 ...

  5. [Webpack] Access Webpack Dev Server from Mobile Safari on an iPhone

    Testing your sites on mobile devices is a critical part of the development process. Webpack dev serv ...

  6. webpack 4 & dev server

    webpack 4 & dev server proxy https://webpack.js.org/configuration/dev-server/#devserverproxy htt ...

  7. webpack安装入门

    这两天心血来潮,突然想研究下webpack,花了一天时间,看网上有很多教程,不过发现安装的都是比较老的版本.后来发现还是我太年轻了,找技术播客还不如找官方网站.下面是一个webpack的官方网站,里面 ...

  8. webpack 安装,打包使用

      Webpack 本身只能处理 JavaScript 模块,如果要处理其他类型的文件,就需要使用 loader 进行转换. 全局安装webpack 打开文件夹amd输入指令  npm i webpa ...

  9. webpack安装以及一些配置

    在用webpack之前... 或说没有实现组件化之前的web1.0时代! 最终迈向web2..0之后的时代! ===============华丽的分割线================== 安装步骤有 ...

  10. nodejs,webpack安装以及初步运用

    nodejs安装: 1.下载:https://nodejs.org/en/download/ 2.安装node-v6.11.3-x64.msi文件,直接默认安装(next……): 3.验证是否完成安装 ...

随机推荐

  1. you-get视频下载

    项目主页 https://github.com/soimort/you-get 使用you-get库一些简单命令下载视频音乐 you-get是一个基于python3的下载器,没有客户端或者可视化工具, ...

  2. 个人永久性免费-Excel催化剂功能第77波-专业图表制作辅助之批量维护序列点颜色及数据标签

    2018年最后一天工作日完成第77波,7是代表完美,2个7,双重的完美,Excel催化剂的2018年从始至终共77波都充满着完美接近极致的功能体验.感谢各位一路相随,陪伴成长.最后一波,再次让数据分析 ...

  3. HHyperledger Fabric 之 TLS (fabric-java-sdk)使用grpcs方式访问fabric

    我在很多fabric的技术群中,很多使用javasdk连接fabric的同友,初始的时候很多都没有成功的使用TLS进行区块链交易: 是sdk不支持,还是我们没有找到解决方案? 其实不然,我这里使用的是 ...

  4. http面试笔试常考知识点(二)

    接上一篇随笔 1. https协议为什么比http安全? 内容加密:建立一个信息安全通道,确保信息传输安全: 身份认证:确保网站的真实性: 数据完整性校验:防止内容被第三方冒充或者篡改 2.常见状态码 ...

  5. html+css test1

    模拟实验楼提供的一个网页.. [可由 git clone https://github.com/shiyanlou/finaltest 获取相关图片素材] <!DOCTYPE html>& ...

  6. sql format 格式化数字(前面补0)

    将一个数字例如33,或1使用t-sql语句转换成033或001 以下是详细分析: 1.select power(10,3)得到1000 2.select cast(1000+33 as varchar ...

  7. C#编程.函数.委托

    注:委托最重要的用途最讲到事件和事件处理时才能说清,这里先简单介绍一下关于委托的一些内容 委托是一种可以把引用存储为函数的类型.这听起来相当棘手,但其机制是非常简单的. 1)委托的声明非常类似与函数, ...

  8. MySQL常用工具、日志及读写分离

    MySQL常用工具.日志及读写分离 1.MySQL中常用工具 1.1 mysql 1.1.1连接选项 1.1.2 执行选项 1.2 mysqladmin 1.3 mysqlbinlog 1.4 mys ...

  9. rm -rf /*时遇到的趣事

    今天在一个linux群里面闲逛的时候,突然看见一个愤青把自己的linux系统给 rm -rf /* 了 ,感觉很好玩就看了一下,突然我发现了有趣的事情! 我的朋友问我,这个为什么显示没有删除,我看了确 ...

  10. (12)ASP.NET Core 中的配置二(Configuration)

    1.内存配置 MemoryConfigurationProvider使用内存中集合作为配置键值对.若要激活内存中集合配置,请在ConfigurationBuilder的实例上调用AddInMemory ...