vue create 创建项目vue项目;脚手架快速搭建

108 阅读2分钟

大家好!今天给大家带来的是脚手架快速搭建vue项目;

第一步:vue create vue-demo(文件名字)

如果朋友们没有安装vue/cli的话需要提前安装:复制下面的即可直接安装

安装后我们可以看到下面有三个选项:控制上下键可以选择自己想要的;这儿我选择的是第四个(手动选择安装);第一个是我保存的记录

npm i -g @vue/cli

vue create 创建项目vue项目;脚手架快速搭建

第二步:当我们点击回车以后就会出现以下的页面;这时候大家可以根据自己 的需要去选择;下面有每个选项的解释;大家可以根据自己想要的进行安装

vue create 创建项目vue项目;脚手架快速搭建

vue create 创建项目vue项目;脚手架快速搭建

图片来源于网络,如有侵权请联系删除

第三步:

这儿是看你需要的什么版本;根据项目需求进行安装;

注:这儿的2.x 代表vue2.0;3.x代表的是 vue3.0(去年8月左右刚出来的)

vue create 创建项目vue项目;脚手架快速搭建

重点:如果选择了这个url 就不会有 # ;如果项目需要的会可以选择;但是记住这儿需要后端支持;不然的话会导致不能正常显示(反正就是不正常嘛,具体我也说不上来);在这儿我是直接选择的n;如果需要的话可以在router里面进行添加一下代码即可

mode: 'history',
base: process.env.BASE_URL,

vue create 创建项目vue项目;脚手架快速搭建

代码风格(代码检测);这个可以看个人喜好来选择;

  1. 第一个是只检测
  2. 这个我不太懂
  3. 标准的
  4. 精确的、漂亮的

一般我是选择的是第三个

vue create 创建项目vue项目;脚手架快速搭建

第一个是指:保存以后就检测

vue create 创建项目vue项目;脚手架快速搭建

后面的直接回车即可;当创建项目成功以后,根据以下代码启动项目即可

npm run serve  // 启动项目

vue create 创建项目vue项目;脚手架快速搭建

vue create 创建项目vue项目;脚手架快速搭建

好啦!项目现在就成功创建了;下文我给大家介绍怎么配置生产环境、开发环境和测试环境的搭建;

谢谢大家观看了哦