npm、webpack、vue学习

---

前言

学习npm的基础命令、webpack的结构及vue的常用模块

本次涉及到的vue是vue2的内容，相关的vuerouter、vuex等内容也会尽量包含其中，更多内容请参考官方文档。

---

提示：以下是本篇文章正文内容，下面案例可供参考

一、npm

1.npm相关概念

JavaScript 的包管理工具, 并且是 Node.js 平台的默认包管理工具。通过 NPM 可以安装、共享、分发代码,管理项目依赖关系

即前端maven工具, node.js有集成，不用单独下载

• 可从NPM服务器下载别人编写的第三方包到本地使用。
• 可从NPM服务器下载并安装别人编写的命令行程序到本地使用。
• 可将自己编写的包或命令行程序上传到NPM服务器供别人使用

2.package.json结构

{
  "name": "npm-demo", //包名，不能大写
  "version": "1.0.0", //版本号
  "description": "first npm demo", // 描述
  "main": "index.js", //程序的主入口文件 index.js
  "scripts": { // 脚本命令组成的对象, 如果 test 测试环境，dev 开发环境， prod 生产环
境
    "test": "echo \"Error: no test specified\" && exit 1"
 },
  "author": "",
  "license": "ISC" //许可证 默认即可
  "denpendencies":{   //项目相关依赖
  }
}

3.npm相关指令

• npm init
  到要创建项目的文件夹下在cmd命令行中使用，其中keywords是便于被搜索的关键字
package.json在此时生成，相当于maven的pom.xml文件

• npm install