vue2使用vue-cli创建项目

1.安装vue脚手架

npm install -g @vue/cli

2.创建项目执行命令

vue create 项目名称

3.选择预设
也可以选默认配置
4.选择项目功能

也可根据需要后期自己安装
5.选择项目版本

我们目前是安装2版本
6.是否使用history路由
这里选择是history模式
7.选择css处理器
这里选择自己更加熟悉的css预处理器
8.代码风格和eslint
根据个人习惯选择即可
9.选择在保存时修改还是在提交时修改

10.设置配置文件的存放位置

11.是否保存本次创建项目的配置项
可以用于下次快速创建vue2项目
12.本次配置保存的名字

13.执行下面命令，项目创建成功

由于我在第8点中选了ESLint + Prettier，所以为了避免ESLint +和Prettier冲突,因此需要创建文件.prettierrc.js

module.exports = {printWidth: 120, // 一行最多 120 字符(默认80)tabWidth: 2, // 每个tab相当于多少个空格（默认2）useTabs: false, // 是否使用tab进行缩进（默认false）semi: false, // 行尾需要有分号(默认true)singleQuote: true, // 使用单引号（默认false）quoteProps: 'as-needed', // 对象的 key 仅在必要时用引号jsxSingleQuote: false, // jsx 不使用单引号，而使用双引号trailingComma: 'none', // 多行使用拖尾逗号（默认none）bracketSpacing: true, // 在对象，数组括号与文字之间加空格 "{ foo: bar }"（默认true）jsxBracketSameLine: false, // 多行JSX中的>放置在最后一行的结尾，而不是另起一行（默认false）htmlWhitespaceSensitivity: 'css', // 根据显示样式决定 html 要不要折行arrowParens: 'avoid', // 只有一个参数的箭头函数的参数是否带圆括号（默认avoid:添加括号）endOfLine: 'auto' // 行尾换行符
}

vue2使用vue-cli创建项目相关推荐

解决@vue/cli 创建项目是安装chromedriver时失败的问题
最近在使用新版vue的命令行工具创建项目时,安装chromedriver老是失败,导致后面的步骤也没有进行.网上搜索了一下,全是使用工作中常见问题汇总及解决方案 npm install chrome ...
Vue cli创建项目时键盘操作无效（箭头移动失效、交互提示符失效）
用 git bash 使用 vue create demo 创建新项目时,键盘方向键失效,无法选中对应的选项(交互提示符不工作),问题状态如下图所示.文中给出四种解决方案,供各位参考. 方案一使用电 ...
vue脚手架安装以及vue脚手架创建项目（详细步骤）
系列文章: 文章目录 node.js安装 vue环境安装 vue创建项目命令行方式创建使用UI界面搭建 idea导入vue项目学习Vue不需要学会Node,Vue是前端框架,nodejs是服务端 ...
使用Vue cli创建Vue项目
使用Vue cli创建Vue项目第一步:安装node.js 安装node.js,从node.js官网下载并安装node,安装过程很简单,一路"下一步"就可以了(傻瓜式安装).安装 ...
使用 Vue CLI 创建 Vue 2.x 项目
使用 Vue CLI 创建 Vue 2.x 项目什么是 Vue CLI 使用 Vue CLI 创建 Vue.js 项目 1. 准备 Node 和 npm 1.1 检查 Node 版本: 1.2 检查 ...
Vue脚手架创建项目流程
Vue脚手架创建项目流程图形化创建在创建文件的文件夹打开cmd, 按住shift右键打开黑窗口,或者直接在文件夹上面路径上面输入cmd 输入vue ui 会自己在浏览器打开点击创建项目项目文件 ...
Vue初始化创建项目
Vue初始化创建项目 1.创建项目: 2.打开项目: 3.删除项目中的默认添加文件 4.添加自己的东西 4.1.初始化HTML中的代码: 4.2.使用视口缩放+rem的方式适配移动端. 4.3.运行查 ...
【Vue】—Vue脚手架创建项目时的 linter / formatter config配置选择
[Vue]-Vue脚手架创建项目时的 linter / formatter config配置选择 ESLint with error prevention only 只进行报错提醒 ESLint + ...
vue cli创建vue3.0项目步骤
1.安装node.js(node.js下载地址) 2. 全局安装vue-cli最新版本 npm install -g @vue/cli 安装成功后,可以通过 vue -V 查看下载的@vue/cli版 ...
VUE——使用VUE脚手架创建项目
前言 vue脚手架工具,对vue项目构造做了封装,直接使用vue-cli创建项目,常用配置自动帮你完成,不用自己像使用webpack一样配置. 目录 1.安装 npm i vue 2.创建vue项目 ...

vue2使用vue-cli创建项目

vue2使用vue-cli创建项目相关推荐

最新文章

热门文章