Vue CLI

环境要求 Nodejs Nodejs 官网下载地址：http://nodejs.cn/download/ 具体安装参考其他资料 打开cmd命令行，输入npm -v，如果出现如下图的显示，说明已经安装正确。 如果安装版本比较老，想升级新版本 npm install npm - g 安装 webpack 安装webpack npm install webpack -g -g 表示安装为全局 安装 vue-cli 安装 vue 脚手架项目初始化工具 vue-cli npm install vue-cli -g 淘宝镜像 npm使用的国外中央仓库，下载速度较慢，有的时候还会有部分文件被墙掉。 npm install -g cnpm --registry=https://registry.npm.taobao.org 建议使用淘宝镜像，安装完淘宝镜像以后可以使用 cnpm 代替 npm。例如webpack可使用如下命令： cnpm install webpack -g . 创建Vue项目 vue init webpack +项目名称 运行vue npm run dev 访问localhost:8080 引入ElementUI 打开项目 src\main.js 添加 import ElementUI from 'element-ui' import 'element-ui/lib/theme

安装vue-cli 安装vue-cli的前提是你已经安装了npm，安装npm你可以直接下载node的安装包进行安装。你可以在命令行工具里输入npm -v 检测你是否安装了npm和版本情况。出现版本号说明你已经安装了npm和node，我这里的npm版本为3.10.10。如果该命令不可以使用，需要安装node软件包，根据你的系统版本选择下载安装就可以了。 下载地址： http://nodejs.cn/download/ npm没有问题，接下来我们可以用npm 命令安装vue-cli了，在命令行输入下面的命令： npm没有问题，接下来我们可以用npm 命令安装vue-cli了，在命令行输入下面的命令： npm install vue-cli -g -g :代表全局安装。如果你安装时报错，一般是网络问题，你可以尝试用cnpm来进行安装。安装完成后，可以用vue -V来进行查看 vue-cli的版本号。注意这里的V是大写的。我这里版本号是2.8.1. 如果vue -V的命令管用了，说明已经顺利的把vue-cli安装到我们的计算机里了。 初始化项目 我们用vue init命令来初始化项目，具体看一下这条命令的使用方法。 vue init <template-name> <project-name> init：表示我要用vue-cli来初始化项目 <template-name>：表示模板名称

本文由葡萄城技术团队原创并首发 转载请注明出处： 葡萄城官网 ，葡萄城为开发者提供专业的开发工具、解决方案和服务，赋能开发者。 2020年9月18日Vue 3.0正式发布，距离2016年10月1日Vue 2.0发布已经过去了4年。不知道发布日期的选择是否是作者尤大有意为之，在这四年间，Vue作为个人项目取得了巨大成功，github上的 star数迅速超过10W，成为了三大前端流行框架之一，而在国内它更是作为前端初学者入门的首选占据着霸主地位。 众所周知，软件开发过程里的重构就像是凤凰浴火，浴火直至永生。2018年2月尤大就有了重构Vue，并于同年九月建立了原型的同时也创建了vue-next的repo，而后正式宣布Vue 3.0项目的启动。随后确定了早期实现的方式（class, TypeScript, hooks, time slicing）以及建立了RFC（Request for Comments，征求意见）流程。 在Composition API 确定之前，团队经历了Class API 和 Function API的讨论，功能的回退。团队始终希望保持Vue平缓的学习曲线，以及与用户一起成长的态度，Vue 3.0开发并不激进。在2019年8月确定了 Composition API RFC，随后关于3.0周边的开发也加快了步伐，并与2020年1月2日发布了alpha版本

vue使用npm run build命令打包项目 当我们使用vue-cli脚手架完成一个项目的时候，下一步肯定会想要怎么把这个项目放到互联网上或者本地直接打开呢，我们在本地调试的时候只要命令行执行 npm run dev 就可以把这个项目跑起来，但是现在我们要把他放到服务器上的话用 npm run build 命令就可以啦。 首先 命令行执行 npm run build 命令，命令需要在项目目录下执行 C:\Users\John\Desktop\demo>npm run build 我的是一个在桌面叫demo的项目 出现以下提示表示打包完成： 然后 我们就可以像打开静态网页一样打开我们完成的项目。 下图为打包生成的dist文件夹，其中index.html为入口文件： 没错，这时你打开了index.html文件，发现网页一片空白，打开F12发现console报了几个错误，状态码为404： 这是因为引用资源的路径问题，我们只要在下图的地方修改一下再打包就可以了。 需要修改的文件在项目目录下的 config文件夹里的index.js文件 中 改完，再次执行 npm run build ，然后打开 index.html 发现sucess demo 完。 来源： oschina 链接： https://my.oschina.net/u/4363760/blog/3594577

如果电脑已安装vue-cli2.9.6，需要先卸载，然后重装vue-cli3.11.0操作如下 等待几分钟，卸载完成，输入npm install -g @vue/cli 等待安装完成，输入vue -V查看脚手架版本号 下面开始创建项目 首先进入你指定的工作空间文件夹，输入vue create 项目名称 选择default，等待项目创建完成，输入cd 项目名称，进入项目，然后启动项目npm run serve 启动成功后，可通过url在浏览器中打开项目查看 浏览器打开： 原文出处：https://www.cnblogs.com/poison-future/p/11629676.html 来源： oschina 链接： https://my.oschina.net/u/4360351/blog/3251167

https://juejin.im/post/5e3664e16fb9a0300300899e 缘起 此次肺炎疫情波及甚广，只能自封于家中看看新闻、打打游戏。 昨天看了 山月 大佬的 《武汉肺炎疫情实时动态省市地图开发》 心潮澎湃，决定拿起键盘照撸一个。开发时间较短，bug在所难免，各位大佬见谅。 程序基本介绍 数据抓取自 腾讯新闻 图表采用Echarts(内部使用了vue-echarts) 支持【省】级地图 Vue-cli@3脚手架项目 查看源代码 线上示例 快速开始 # 安装依赖 npm i # 抓取腾讯新闻数据 node ./build-data.js # 开发模式 npm run serve 复制代码 未实现 定时执行 build-data.js，抓取最新数据。 来源： oschina 链接： https://my.oschina.net/u/4383709/blog/3206258

https://juejin.im/post/5e3664e16fb9a0300300899e 缘起 此次肺炎疫情波及甚广，只能自封于家中看看新闻、打打游戏。 昨天看了 山月 大佬的 《武汉肺炎疫情实时动态省市地图开发》 心潮澎湃，决定拿起键盘照撸一个。开发时间较短，bug在所难免，各位大佬见谅。 程序基本介绍 数据抓取自 腾讯新闻 图表采用Echarts(内部使用了vue-echarts) 支持【省】级地图 Vue-cli@3脚手架项目 查看源代码 线上示例 快速开始 # 安装依赖 npm i # 抓取腾讯新闻数据 node ./build-data.js # 开发模式 npm run serve 复制代码 未实现 定时执行 build-data.js，抓取最新数据。 来源： oschina 链接： https://my.oschina.net/u/4390958/blog/3202120

个人搭建的Vue项目模板　　默认自带 Vuex Less 　　封装内容如下 　　　　vue.config 　　　　axios 封装 　　　　vue 配置环境文件 　　　　vue 自定义路径映射　 （cli3.0取消了默认@ 映射src的方式） 　　　　 vue 代理 自行选择UI库 项目地址　　 https://github.com/Zlinks19/VueCLi3.0-template 　　 来源： oschina 链接： https://my.oschina.net/u/4389235/blog/3571197

https://blog.csdn.net/u014633852/article/details/73706459 https://segmentfault.com/a/1190000011878086 这个是另一个typescript配置的文件 >npm i ts-loader typescript tslint tslint-loader tslint-config-standard --save-dev vue与TypeScript集成配置最简教程 vue与TypeScript集成配置最简教程 前言 初始化项目 配置 测试 进阶 前言 Vue的官方文档没有给出与TypeScript集成的具体步骤，网上其他的教程不是存在问题就是与vue-cli建立的项目存在差异，让人无从下手。 下面我就给出vue-cli建立的项目与TypeScript集成的最简配置。 初始化项目 首先用vue-cli建立webpack项目。这里为了演示方便，没有打开router和eslint等，可以根据自身情况打开。 # vue init webpack vue-typescript ? Project name vue-typescript ? Project description A Vue.js project ? Author ? Vue build standalone ? Install vue

vue-cli3 搭建 vue 项目 <font color="red">项目是在mac的环境下配置的 win的同学请移步</font>【 https://www.cnblogs.com/zhaomeizi/p/8483597.html】 <br/> 安装 node.js 1. 首先是打开node官网【 https://nodejs.org/en/#download】 下载LTS版本，一路傻瓜式安装。 2. 打开Mac下的终端输入：node -v 会出现版本号就说明成功了。 安装 npm 1. 首先获取 node 的安装模块的权限 sudo chmod -R 777 /usr/local/lib/node_modules/ 2. 然后安装 npm 淘宝镜像 npm install -g cnpm --registry=https://registry.npm.taobao.org 3. 检测是否安装 npm 成功 npm -v 安装 webpack (全局安装) npm install webpack -g <font color="red">如果安装卡住了，或者安装不上，可以尝试</font> cnpm install webpack -g 安装 vue 手脚架（全局安装，比如 vue 模板等） npm install vue-cli -g 创建 vue 项目 1.