webpack 和 webpack-cli 安装和使用中出现的问题
因为国内防火墙的原因,建议首先安装 cnpm:
使用 npm install cnpm -g 或者 npm install -g cnpm --registry=https://registry.npm.taobao.org
【注】G:\MyWeb\...处为自定义的文件夹地址
安装 webpack 和 webpack-cli:
可以用分别用 cnpm install webpack -D 和 cnpm install webpack-cli -D 分别安装,也可以用 cnpm install webpack webpack-cli -D 一起安装,因为之前就出了问题,为了找问题我采用的分别安装

【注】下图中 cnpm i 是 cnpm install 的缩写

但是安装后还是有问题(此处 if ( 已经打包成功 ) return )

尝试在初始化时生成的 package.json 文件中添加 dev:webpack 后运行也是出错


找到提示的这个日志文件,把文件夹中的日志删除,然后重新下载依赖:
使用 cnpm install webpack -g 和 cnpm install webpack-cli -g 命令直接下载(为了试错我是分别安装的,另外使用 npm 会报错)

使用 cnpm install webpack -g 命令下载

再使用 cnpm i webpack -D 安装,别忘了还有 webpack-cli 也要执行一遍下载和安装,是否可以使用 cnpm i webpack webpack-cli -g 和 cnpm i webpack webpack-cli -D 直接一次下载安装我没试过,折腾太久不想试了,试过的朋友可以留个言

最后设置好 webpack.config.js 配置文件,再次运行 webpack 打包成功

webpack 和 webpack-cli 安装和使用中出现的问题的更多相关文章
- Webpack 入门指南 - 1.安装
Webpack 是目前流行的打包工具,如何安装它呢? 1. 安装 Node Js 首先,Webpack 是基于 NodeJs 的工具,你必须首先安装 NodeJs. NodeJs 仅仅只需要在你的系统 ...
- webpack入门——webpack的安装与使用
一.简介 1.什么是webpack webpack是近期最火的一款模块加载器兼打包工具,它能把各种资源,例如JS(含JSX).coffee.样式(含less/sass).图片等都作为模块来使用和处理. ...
- vue-loader配合webpack的使用及安装
vue-loader配合webpack的使用及安装: 工程文件简单的目录结构 index.html main.js 入口文件 App.vue vue文件,官方推荐命名法 package.jso ...
- webpack常用的插件安装命令
webpack常用的插件安装命令:1:npm install html-webpack-plugin --save-dev //自动快速的帮我们生成HTML.2:npm install css-loa ...
- 一、webpack那点事-安装、环境搭建
前言: 还记得两年前刚来公司才几个月,经理就安排我去做JS地图相关的维护和开发工作,然后就跟着一个公司老鸟(没俩月他离职了)熟悉地图相关的功能. 本人嘛,那会前端JS实际开发经验也才几个月,然后当我看 ...
- 安装webpack和webpack打包(此文转自Henery)
Henery博客地址为:http://blog.csdn.net/henery_002 写的很详细,可以做参考 最近要做项目优化了,尤其是前端这块,许多js需要模块化管理和相应的优化 1.输入如下地址 ...
- webpackt入门1:webpack介绍&webpack安装&使用webpack打包
本篇博客不是原创,简书的zhangwang写的,原文太长,我这里只是提取了一部分. 原文地址:入门webpack,看这篇就够了 一.Webpack解决了什么问题 问题1.JavaScript这个脚本化 ...
- webpack快速入门——如何安装webpack及注意事项
1.window+R键,输入cmd打开命令行工具,输入 mkdir XXXX(XX:文件夹名): 2.cd XXX 进入刚刚创建好的文件夹里,输入cnpm install -g webpack (安装 ...
- webpack基础+webpack配置文件常用配置项介绍+webpack-dev-server
一.webpack基础 1.在项目中生成package.json:在项目根目录中输入npm init,根据提示输入相应信息.(也可以不生成package.json文件,但是package.json是很 ...
随机推荐
- 21-Java-Hibernate框架(一)
一.Hibernate了解 Hibernate框架是Java持久层的框架,是Gavin King发明的,2001年发布的,JBoss公司的产品,2003年进入市场. Hibernate是基于对象来操作 ...
- win10下cuda安装以及利用anaconda安装pytorch-gpu过程
安装环境:win10+2070super 1.Cuda的下载安装及配置 (1)测试本机独立显卡是否支持CUDA的安装,点击此处查询显卡是否在列表中. (2)查看自己是否能右键找到NVIDA控制面板,如 ...
- 关于MIME类型问题,浏览器请求到的资源是乱码
简介 我想很多同学都可能会遇到这样的问题,调用后台提共的静态资源服务api时,用浏览器打开发现却是一堆乱码.需要的是 JSON, 拿到的却是 xml,访问一个mp4的文件,浏览器直接下载.这一切的来源 ...
- 7.关于一些dom&&获取元素
1. 测试点击的是否是span 标签 <span onClick={this.select.bind(this)}>点击</span> select( e ){ cons ...
- UnicodeDecodeError: 'gbk' codec can't decode byte 0x8a in position 2: illegal multibyte sequence
pycharm报错UnicodeDecodeError: 'gbk' codec can't decode byte 0x8a in position 2: illegal multibyte seq ...
- TokenMismatchException Laravel
随便写写:很久没写了,今天闲的. 1.错误原因:出现这个错误肯定是因为你在Laravel开启了csrf防御,但是你post提交过去的字段中没有生成_token. 2.如果你提交的字段中带有了_toke ...
- 十七, Oracle索引约束
管理索引-原理介绍 索引是用于加速数据存取的数据对象.合理的使用索引可以大大降低i/o次数,从而提高数据访问性能. 单列索引 适当的索引对于大型数据库的性能有不错的提升, 但在创建索引时要小心.选择字 ...
- 2019-2020-1 20199329《Linux内核原理与分析》第六周作业
<Linux内核原理与分析>第六周作业 一.本周内容概述: 学习系统调用的相关理论知识,并使用库函数API和C代码中嵌入汇编代码两种方式使用getpid()系统调用 学习系统调用syste ...
- JavaScript HTMlL DOM对象(下)
DOM:document operation model 文档操作模型 每个标签都是一个对象. 一.查找元素 DOM 回顾 直接查找 var obj = document.getElementById ...
- 全网最清晰的ConstraintLayout教程
ConstraintLayout是AndroidStudio2.2新增的一个功能,那么这个到底是什么呢?首先第一点我们知道传统的安卓开发,页面基本都是XML编写实现,特别在一些复杂的页面上需要嵌套多层 ...