关于 webpack 和 npm 中几个问题的说明| 学习笔记

简介: 快速学习关于 webpack 和 npm 中几个问题的说明

开发者学堂课程前端自动化构建工具 Webpack关于 webpack 和 npm 中几个问题的说明】学习笔记,与课程紧密联系,让用户快速学习知识。

课程地址:https://developer.aliyun.com/learning/course/587/detail/8224


关于 webpack npm 中几个问题的说明


json里面不能写注释

运行命令:npm run dev

报错代码:

PsC:\Users\liulongbin\Desktop\day6\代码\01.webpack-study> npm run dev

npm ERR! Windows NT 10.0.15063 //

npm ERR!argv"C:\\Program Files!\nodejs\node.exe" "C:\\Program Files\ InodejslInode modules\\npm\\bin\ \npm-cli.js""run"”dev”

npm ERR! Node v6.11.1  // node版本号

npm ErR! npm v3.10.10  //npm版本号

npm ERR! file C:\Users\liulongbin\Desktop\day6\代码\01.webpack-study\package.json

npm erR! code EJSONPARSE // json转换失败

npm ErR! Failed to parse json //在解析json文件时出错

npm ERR! Unexpected token '/at 7:5 //意想不到的一个符号’/‘在第七行第五个字符

打开package.json

// "test": "echo \"Error: no test specified\" && exit 1"有错

注释无意义,删去

npm ERR! // "test": "echo \"Error: no test specified\" && exit 1"

npm ERR!

npm ERR!File:C:\Users\liulongbin\Desktop\day6\代码\01.webpack-study\package.json

npm ERR! Failed to parse package.json data.

npm ERR! package.json must be actual json, not just JavaScript.

npm ErR!

npm ErR! This is not a bug in npm.

npm ErR!Tell the package author to fix their package.json file. JSON.parse

npm ErR!Please include the following file with any support request:

npm ErR! C:Users\liulongbin\Desktop\day6\代码\01.webpack-study\npm-debug.log

删除错误代码之后提示

再次报错

Webpack-dev-serve 不是内部或外部命令,也不是可运行的程序或批处理文件

与之前错误不同,之前错误原因为:json 中不能写注释,需要注意,不要觉得文件中带有 confing就是配置文件,要以最终的文件来进行定义

新错误在 node 阶段,输入node 也会提示 node 不是内部或外部命令,原因是pass环境变量里面的问题,查询不到 node 命令,但实际上是安装的,所以说明是环境变量的问题,

Webpack-dev-server 只需要本地安装,不需要安装全局,意思就是本地中找不到 Webpack-dev-server 这个包,但是在上节课当中可以正常运行。

只能证明你曾经安装过这个,但是不能证明现在依旧存在,只是记录曾经安装的,删除后记录依旧存在,打开路径之后发现并不存在 Webpack-dev-server

重新装一下

输入 cnpm i 注意安装过程中,可能会等待时间较长,不能关闭,再安装,出现一些问题,删除之后重装只能一次安装完成

装好后在输入 npm run dev 运行

相关文章
|
12月前
|
JavaScript 前端开发 数据库
前端常见知识点汇总(ES6,Vue,axios,Node.js,npm,webpack)-3
前端常见知识点汇总(ES6,Vue,axios,Node.js,npm,webpack)
101 0
|
6月前
|
存储 缓存 JavaScript
《Webpack5 核心原理与应用实践》学习笔记-> webpack的loader开发技巧
《Webpack5 核心原理与应用实践》学习笔记-> webpack的loader开发技巧
82 1
|
6月前
|
缓存 监控 JavaScript
《Webpack5 核心原理与应用实践》学习笔记-> webpack极致性能优化
《Webpack5 核心原理与应用实践》学习笔记-> webpack极致性能优化
77 1
|
6月前
|
存储 缓存 前端开发
《Webpack5 核心原理与应用实践》学习笔记-> webpack5持久化缓存
《Webpack5 核心原理与应用实践》学习笔记-> webpack5持久化缓存
241 1
|
6月前
|
前端开发 测试技术
《Webpack5 核心原理与应用实践》学习笔记-> webpack核心配置结构
《Webpack5 核心原理与应用实践》学习笔记-> webpack核心配置结构
120 1
|
6月前
|
JavaScript 前端开发 Windows
《Webpack5 核心原理与应用实践》学习笔记-> 构建Electron
《Webpack5 核心原理与应用实践》学习笔记-> 构建Electron
77 1
|
6月前
|
JSON 监控 测试技术
《Webpack5 核心原理与应用实践》学习笔记-> 提升插件健壮性
《Webpack5 核心原理与应用实践》学习笔记-> 提升插件健壮性
89 0
|
6月前
|
缓存 前端开发 API
《Webpack5 核心原理与应用实践》学习笔记-> webpack插件开发基础
《Webpack5 核心原理与应用实践》学习笔记-> webpack插件开发基础
128 0
|
6月前
|
前端开发 JavaScript 测试技术
《Webpack5 核心原理与应用实践》学习笔记-> webpack的loader运行与调试
《Webpack5 核心原理与应用实践》学习笔记-> webpack的loader运行与调试
69 0
|
6月前
|
前端开发 JavaScript
《Webpack5 核心原理与应用实践》学习笔记-> webpack代码压缩
《Webpack5 核心原理与应用实践》学习笔记-> webpack代码压缩
160 0

推荐镜像

更多