vue基础(一)-使用vue-cli4.1.2创建项目

今天我们来用vue+Element搭建一个前台项目,废话不多说,咱们开始吧!环境安装的话大家可以参考一下这里。在这里我用的vue脚手架的版本是@vue/cli 4.1.2。

创建项目
vue create 项目名称

选择手动配置(如果喜欢使用eslint可以选择默认)
vue基础(一)-使用vue-cli4.1.2创建项目_第1张图片
键盘上下键即可切换,刚开始其实有两个选项,我之前曾经自定义过,所以有四个。选择手动配置,按Enter键。

自定义配置如下

vue基础(一)-使用vue-cli4.1.2创建项目_第2张图片
按空格键选中或取消

路由规则

接下来提示我们是否使用history router,也就是是否路径到#符号,建议选N。
vue基础(一)-使用vue-cli4.1.2创建项目_第3张图片

css预处理器

css预处理器选择Sass/SCSS (with dart-sass)
vue基础(一)-使用vue-cli4.1.2创建项目_第4张图片

ESLint效验规则

ESLint代码效验,选择ESLint + Prettier
vue基础(一)-使用vue-cli4.1.2创建项目_第5张图片

效验的时机

选择什么时候进行效验,选第一个,保存就效验
vue基础(一)-使用vue-cli4.1.2创建项目_第6张图片

存放配置

选择如何存放配置,第一个选择存放到独立文件中,第二个存放到package.json中,一般选择第二个:
vue基础(一)-使用vue-cli4.1.2创建项目_第7张图片

是否保存此次配置

接下里选择是否保存此次的一系列配置,如果选择Y需要输入保存的名字,这里选择N:
vue基础(一)-使用vue-cli4.1.2创建项目_第8张图片

生成项目

vue基础(一)-使用vue-cli4.1.2创建项目_第9张图片

运行项目

cd进入项目,输入下面命令,即可跑起来

npm run serve

大家如果想获取最新的文章,可以关注一下我的公众号,以后都会给大家分享满满的干货。
vue基础(一)-使用vue-cli4.1.2创建项目_第10张图片

你可能感兴趣的:(vue,Element)