vue脚手架3.0的搭建
一、安装node
打开cmd输入node -v查看是否安装成功

显示node版本号表示安装成功,显示‘node’不是内部或外部命令表示未安装node。
node安装地址:http://nodejs.cn/download/
注 :安装 vue-cli 脚手架目前需要node版本为 v4.0 以上。
二、vue-cli3.0全局安装
输入npm install -g @vue/cli命令全局安装,完成后输入vue -V(V大写)查看是否安装成功。

显示vue版本表示安装成功。
输入vue查看vue命令

三、开始创建项目
新建一个文件夹,cmd切换到该文件夹,输入vue create project-name命令。

按键盘上下键选择默认(default)还是手动(Manually),如果选择default,一路回车执行下去就行了(注:现在vue-cli3.0默认使用yarn下载),这里我们来选择手动下载。
四、进行配置选择
你项目中用到哪些就选择相应的进行配置就行了(注:空格键是选中与取消,A键是全选)。

五、选择css预处理,这里我选择stylus

六、选择ESLint + Prettier

七、选择语法检查方式,这里我选择第一个保存就检测

八、选择把Babel、PostCss、ESLint这些配置的文件放哪里,这里我选择第一个独立放置文件

九、是否记录以便下次继续使用这套配置(选择Y需要输入保存名字,N不记录)

十、等待下载依赖模块

十一、cd到project-name然后npm run serve启动项目


十二、修改端口,在根目录下创建vue.config.js

官方vue.config.js 参考文档 https://cli.vuejs.org/zh/config/#css-loaderoptions
vue脚手架3.0的搭建的更多相关文章
- Vue脚手架(vue-cli)搭建和目录结构详解
一.环境搭建 1.安装node.npm.webpack,不多说 2.安装vue-cli脚手架构建工具,打开命令行工具输入:npm install vue-cli -g,安装完成之后输入 vue -V( ...
- React/VUE 脚手架2.0和3.0
react官方脚手架 npm install -g create-react-app create-react-app my-app cd my-app npm start 区别自己对比 vue2.x ...
- 使用Vue脚手架(vue-cli)从零搭建一个vue项目(包含vue项目结构展示)
注:在搭建项目之前,请先安装一些全局的工具(如:node,vue-cli等) node安装:去node官网(https://nodejs.org/en/)下载并安装node即可,安装node以后就可以 ...
- vue脚手架3.0的安装与使用
一.安装 1.先检查是否有安装vue (vue-cli3需要node大于等于8.9版本) //vue -V 2.如果没安装跳过.安装有3.0以下的版本就的先卸载掉以前的版本 npm uninstal ...
- vue-cli3.0 vue脚手架3.0的使用
1.安装vue-cli 3.0 npm install -g @vue/cli # or yarn globaladd @vue/cli 安装成功后查看版本:vue -V(大写的V) 2.命令 ...
- Django + Vue cli 3.0 访问静态资源问题
[问题背景] 用Vue clie 3.0的搭建得框架把我坑死了,在打包后,调用不到静态资源js,css,mp3等 [问题原因] vue cli 3.0打包后,dist目录下没有static目录,而Dj ...
- 从0开始搭建vue+webpack脚手架(三)
在从0开始搭建vue+webpack脚手架(二)中已经基本完成了开发环境的配置.当开发完成后,我们需要将完成的项目进行打包,接下来对打包做一些优化: 运行 $ npm run build 可生成dis ...
- 从0开始搭建vue+webpack脚手架(二)
接着从0开始搭建vue+webpack脚手架(一) 三.配置webpack-dev-server 1. webpack-dev-server自带一个node的服务器, 项目在服务端运行的同时可以实现热 ...
- vue/cli 3.0脚手架搭建
在vue 2.9.6中,搭建vue-cli脚手架的流程是这样的: 首先 全局安装vue-cli,在cmd中输入命令: npm install --global vue-cli 安装成功: 安装完成 ...
随机推荐
- Scala之面向对象
1. Scala基础练习 不使用str.toLong,str.toInt/Integer.valueOf()/Long.valueOf/Integer.parseInt()等,将字符串"12 ...
- zookeeper启动闪退
编辑zkServer.cmd在它的尾行加上 pause 就可以将闪退停住来观察闪退的原因. 遇到Exception in thread "main" java.lang. ...
- Python3基础笔记---re模块
参考博客: Py西游攻关之模块 就其本质而言,正则表达式(或 RE)是一种小型的.高度专业化的编程语言,(在Python中)它内嵌在Python中,并通过 re 模块实现.正则表达式模式被编译成一系列 ...
- 三维偏序(陌上花开) CDQ分治
十分巧妙. Code: #include <cstdio> #include <algorithm> #include <cstring> #define setI ...
- Vue和vue-template-compiler版本之间的问题
今天把远程仓库拉下项目,运行'npm run dev'时,报错 Module build failed: Error: Cannot find module 'vue-template-compile ...
- caioj 1072 动态规划入门(二维一边推5:最长公共子序列 LCSS加强版)
在51nod刷到过同样的题,直接秒杀 见https://blog.csdn.net/qq_34416123/article/details/81697683 #include<cstdio> ...
- 安卓Gallery配合ImageSwitcher不显示图片
Gallary装的是缩略图(thumb),ImageSwitcher装的是大图. 不显示图片的一个可能原因是gallery没设置代理器,另一个原因是没使用相对布局. GalleryActivity.j ...
- 目标跟踪--CamShift
转载请注明出处! !! http://blog.csdn.net/zhonghuan1992 目标跟踪--CamShift CamShift全称是ContinuouslyAdaptive Mean S ...
- 如何下载最新版的 Adobe Flash Player
如何下载最新版的 Adobe Flash Player 中国访客用代理访问下面的链接,否则会自动跳转到 https://www.flash.cn/ 当我们从 https://get.adobe.com ...
- CetnOS6 网络配置,主机名配置
CetnOS6 网络配置,主机名配置 一.通过命令ifconfig -a 查看可用网络设备 二.通过网络配置文件/etc/sysconfig/network-scripts/ifcfg-eth0 配置 ...