怎么构建vue-cli项目
1.安装node.js(已安装可直接跳过,建议查看node版本,node -v);
2.npm包管理器,是集成在node中的,可跳过(npm -v);
3.由于npm的有些资源被墙,为了更快更稳定,所以我们需要切换到淘宝的npm镜像——cnpm。(全局安装: npm install -g cnpm,查看版本:cnpm -v)
4.vue安装: npm install vue或者采用cnpm安装;npm与cnpm安装的区别在于一个慢一个快,一个下载的东西不杂一个杂;
5.安装vue-cli脚手架构建工具,全局安装 cnpm install --global vue-cli
6.创建一个基于 webpack 模板的新项目, vue init webpack my-project,(my-project为自己项目的文件夹)
注意事项:
Project name (my-project) # 项目名称(我的项目)
Project description (A Vue.js project) # 项目描述一个Vue.js 项目
Author 作者(你的名字)
Install vue-router? (Y/n) # 是否安装Vue路由(但页面应用需要的模块)
Use ESLint to lint your code? (Y/n) # 使用 ESLint 到你的代码? (Y [ yes ] / N [ no ])建议N
Pick an ESLint preset (Use arrow keys) # 选择一个预置ESLint(使用箭头键)建议N
Setup unit tests with Karma + Mocha? (Y/n) # 设置单元测Karma + Mocha? (Y/ N)建议N
Setup e2e tests with Nightwatch? (Y/n) # 设置端到端测试,Nightwatch? (Y/ N)建议N
7.安装项目依赖, cnpm install ($ cnpm i)
8.运行环境, cnpm run dev;
附:vue init mpvue/mpvue-quickstart firstapp (生成使用vue的微信小程序)
怎么构建vue-cli项目的更多相关文章
- 改造@vue/cli项目为服务端渲染-ServerSideRender
VUE SEO方案二 - SSR服务端渲染 在上一章中,我们分享了预渲染的方案来解决SEO问题,个人还是很中意此方案的,既简单又能解决大部分问题.但是也有着一定的缺陷,所以我们继续来看下一个方案--服 ...
- 从无到有构建vue实战项目(一)
vue的安装 首先下载nodehttp://nodejs.cn/download/ 有两种安装方式安装包安装和二进制文件安装 输入以下命令,出现版本提示表示安装成功: node -v 10.15.3 ...
- 从无到有构建vue实战项目(四)
六.webpack的安装和配置 为了快速构建vue项目,webpack是一个必不可少的工具,我们先来安装它,附上官网地址:https://www.webpackjs.com/ 要安装最新版本或特定版本 ...
- Vue cli项目开启Gzip
目录 安装 compression-webpack-plugin 更改配置文件 服务器开启gzip功能 安装 compression-webpack-plugin 建议安装v1.1.11版本,最新版本 ...
- 从无到有构建vue实战项目(二)
二.vue项目的初步搭建 该项目我采用了当下最流行的vue ui框架---element-ui,首先用vue-cli构建一个vue项目: vue create education 然后会出现一系列配置 ...
- vue cli 项目的提交
前提: 配置git.以及git的ssh key信息 假设已经都安装好了,此处我用vue项目为例,因为vue-cli已经默认为我生成了ignore文件 在项目目录 初始化本地仓库,会创建一个.git目录 ...
- 从无到有构建vue实战项目(三)
四.响应式布局的实现 elemnt-ui参考bootatrap提供了响应式布局,附上地址:https://element.eleme.cn/#/zh-CN/component/layout 以下是我的 ...
- 从无到有构建vue实战项目(五)
八.错误总结(一) webpack打包项目识别子组件路径问题 之所以出现了这样的问题是因为在webpack打包项目时,未将此处的子组件路径正确识别: 将此处的carousel改为carousel.vu ...
- 从无到有构建vue实战项目(六)
十.徒手撸一个vue下拉左侧二级导航 先附上最终效果图: vue代码: <div class="dropdown-menu-explore" v-on:mouseover=& ...
- 从无到有构建vue实战项目(七)
十四.Vuex的使用 Vuex是什么? Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式.它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化.Vu ...
随机推荐
- linux下安装vld
将vld-0.10.1下载并传到/home/wangxiaolan/tar 1.进行解压 tar zxvf vld-0.10.tgz 2.进入 cd vld-0.10.1 3.usr/local/ph ...
- C# 操作PDF 图层(Layer)——添加、删除图层、设置图层可见性
前言 通过添加图层,我们可以将文本.图片.表格.图形等元素精确定位于页面指定位置,将这些元素进行叠放.组合形成页面的最终效果.此外,对于页面中已有的图层我们也可以进行设置图层可见性.删除图层等操作.因 ...
- 数据准备<3>:数据预处理
数据预处理是指因为算法或者分析需要,对经过数据质量检查后的数据进行转换.衍生.规约等操作的过程.整个数据预处理工作主要包括五个方面内容:简单函数变换.标准化.衍生虚拟变量.离散化.降维.本文将作展开介 ...
- jvm GC
JavaGC.新生代.老年代 Java 中的堆是 JVM所管理的最大的一块内存空间,主要用于存放各种类的实例对象. 在 Java 中,堆被划分成两个不同的区域:新生代 ( Young ).老年代 ( ...
- 8.Vue基础
环境搭建 node.js安装 https://nodejs.org/en/ cnpm npm install -g cnpm --registry=https://registry.npm.taoba ...
- apache2.4 虚拟主机配置
网上教程很多,仅记录我的配置,可供参考 一.修改httpd.conf 打开appserv的安装目录,找到httpd.conf文件,分别去掉下面两行文字前面的#号. #LoadModule vhost_ ...
- 用R语言进行文本挖掘和主题建模
欢迎大家前往腾讯云+社区,获取更多腾讯海量技术实践干货哦~ 我们每天都会遇到各种各样的文本数据,但大部分是非结构化的,并不是全部都是有价值的. 据估计,全球约80%的数据是非结构化的.这包括音频,视频 ...
- InnoDB基本特性
Ⅰ.double write 目的:保证数据写入的可靠性 小知识: 什么是partial write? 16k的page只写入了4k,6k,8k,12k就断掉了的情况 corrupt的page就是pa ...
- spring security oauth2
https://connect.qq.com/manage.html#/ http://wiki.connect.qq.com/%E7%BD%91%E7%AB%99%E5%BA%94%E7%94%A8 ...
- width和max-width的用处
width默认是auto啊,你设置max-width相当于没设置width,它按默认值auto自然就是图片宽度咯.max-width很多的场景都是和width配合用的:比如设置一个标签,width是( ...