browserify

前言 vue-cli是Vue官方提供的命令行工具，可用于快速搭建大型单页应用。集成了webpack环境及主要依赖，对于项目的搭建、打包、维护管理等都非常方便快捷。建议先熟悉 Vue 本身之后再研究 CLI。 使用之前需要对 Node.js 和相关构建工具有一定程度的了解。 安装 先决条件：Node.js（> = 4.x，6.x首选），npm版本3+和Git。 注：建议将 npm 的注册表源设置为国内的镜像，可以大幅提升安装速度。 npm config set registry https://registry.npm.taobao.org //更换国内淘宝的镜像 注意：安装完后最好查看其版本号cnpm -v或关闭命令提示符重新打开，安装完直接使用有可能会出现错误； cnpm跟npm用法完全一致，只是在执行命令时将npm改为cnpm（以下操作将以cnpm代替npm）。 全局安装vue-cli npm install -g vue-cli 创建项目 了解官方模板 Vue官方为我们提供了几种模板，方便我们进行快速开发。根据需要选择适合自己的模板。 当前可用的模板包括： webpack - 一个全功能的Webpack + vue-loader设置，具有热重新加载，linting，测试和css提取。 webpack-simple - 一个简单的Webpack + vue-loader设置

一、什么是模块、模块化 一个封装好的功能实现可以看成一个模块，一个js文件可以看成一个模块 模块就是一个实现特定功能的文件，有了模块我们就可以更方便的使用别人的代码，需要什么功能就加载什么模块 模块化就是一种管理方式，一种生产方式，一种解决方案（引入了模块化规范） 二、模块化的好处 避免命名冲突（减少命名空间污染） 更好的分离，按需加载 更高复用性 高可维护性 三、发展历程 模块化的发展历程 CommonJS(服务端) => AMD (浏览器端) => CMD / UMD => ES Modul 四、模块化规范 1、CommonJS（node根据该规范编写） 说明： 每一个文件都可以当做一个模块 在服务器端：模块的加载 是运行时同步加载的 在浏览器端：模块需要提前编译打包处理 基本语法： 模块引入：require（xxx） 　　第三方模块：xxx为模块名 　　自定义模块：xxx为模块文件路径 暴露模块：exports.xxx = value 和 module.exports = value 　　暴露的模块 本质是 exports 对象 　　exports本身是一个空对象 exports.xxx = value是给exports对象添加属性或方法 　　module.exports = value 是直接用value新对象来覆盖原来的空对象 实现： 服务器端实现：Node.js

VUE环境搭建 安装VUE NPM方式 在用 Vue 构建大型应用时推荐使用 NPM 安装[1]。NPM 能很好地和诸如 webpack 或 Browserify 模块打包器配合使用。同时 Vue 也提供配套工具来开发单文件组件。 # 最新稳定版 $ npm install vue 安装 命令行工具 (CLI) Vue 提供了一个官方的 CLI，为单页面应用 (SPA) 快速搭建繁杂的脚手架。 npm install -g @vue/cli # OR yarn global add @vue/cli 创建一个vue项目 vue create 项目名称 项目创建成功。 启动项目 1.进入项目目录 2.启动项目 npm run 项目名 项目文件目录介绍 .git (隐藏文件) ===》git初始化时候的文件 node_modules ===》项目所有依赖的包文件 public ===》本地服务器的文件夹 index.html 主页 src ===》工作目录 assets ==>资源（图片，css） components ==>当如组件 App.vue ==>根组件 main.js 项目全局配置 .gitignore ===》不需要上传到仓库的文件 package.json ===》有关bable的配置 README.md ===》说明文件 项目启动先访问index.html 页面==》

问题： I'm trying to summarize my knowledge about the most popular JavaScript package managers, bundlers, and task runners. 我试图总结我对最流行的JavaScript包管理器，捆绑器和任务运行器的了解。 Please correct me if I'm wrong: 如果我错了，请纠正我： npm & bower are package managers. npm 和 bower 是程序包管理器。 They just download the dependencies and don't know how to build projects on their own. 他们只是下载依赖项，而不知道如何自行构建项目。 What they know is to call webpack / gulp / grunt after fetching all the dependencies. 他们知道什么是调用 webpack / gulp / grunt 获取所有的依赖后。 bower is like npm , but builds flattened dependencies trees (unlike npm which do it recursively).

vue create 和 vue init的区别 vue init <template> <dir> 可以根据模版创建项目 ，可供选择的模版有 browserify browserify-simple simple webpack webpack-simple 使用 vue init webpack-simple demo 可以创建一个webpack打包的项目 使用 vue create <dir> 可以创建出vue-cli官方打包的项目 插件的写法 定义 、 安装 调用 Mixin的使用 定义 使用 不使用Vuex ，手写state的写法 构造state数据 编写state插件 引入state 使用state filters写法 定义 注册 来源： oschina 链接： https://my.oschina.net/lilugirl2005/blog/3219467