美文网首页
vue脚手架安装及项目搭建

vue脚手架安装及项目搭建

作者: 灰灰_82a6 | 来源:发表于2018-12-23 21:07 被阅读0次

老版本vue-cli安装命令

vue init webpack 项目名

image.png

老版本Vue CLI 卸载

Vue目前最新的脚手架版本是3.x ,如果你的电脑目前还是1.x或2.x 。可以使用如下命令卸载 :

npm uninstall vue-cli -g
注意 :Vue CLI需要Node.js版本8.9或者更高版本,版本太低的需要更新一下node版本。

新版本Vue CLI 安装

使用如下命令安装新版本:

npm install -g @vue/cli

安装之后 ,使用如下命令查看版本:
vue --version

如果像下面这样显示3.x 版本 ,则安装成功。


image.png

创建一个简单的项目

使用如下命令创建项目:

vue create 项目名

例如如下:


image.png

在创建项目的过程中会让你选择项目的一些配置 ,例如上面的Babel + ESLint 。可以直接回车 ,使用默认的创建一个项目。

启动项目

创建好项目之后 ,进入项目根目录 。使用如下命令启动项目

npm run serve
启动后 ,在界面中可看到如何在浏览器访问:

image.png

使用http://localhost:8080/访问如果出现如下页面 ,说明配置成功了。

image.png

相关文章

  • 2018-12-17

    Vue脚手架安装及项目搭建(mac版) 前提:电脑上已经安装好了npm vue脚手架全局安装终端命令 $ sudo...

  • 我的第一个Vue.js项目----仿cnode社区

    一、环境搭建 使用vue-cli脚手架搭建Vue项目 全局安装 npm install -g @vue/cli 查...

  • 01uni-app知识点梳理(一)

    脚手架搭建项目 全局安装npm install -g @vue/cli 创建项目vue create -p dcl...

  • vue-cli搭建cnode社区

    一、准备工作 1.使用vue-­cli脚手架搭建项目,参考我的文章:使用使用vue-­cli脚手架搭建项目2.安装...

  • 2018-05-28

    vue脚手架安装及项目搭建(windows版) 前提是电脑已经安装了你npm命令即node.js 1、终端安装vu...

  • vue项目搭建运行

    vue 项目搭建1.安装node.js2.搭建vue的开发环境,安装vue的脚手架工具,官方命令行工具 s...

  • 【VUE】安装搭建项目vue-cli

    使用 vue-cli 脚手架搭建项目:vue-cli是官方发布的 vue.js 项目脚手架,快速搭建 vue 项目...

  • Vue前后端分离项目开发参考

    搭建项目参考 前端 前期准备 node环境 搭建脚手架 安装需要的依赖:vue全家桶(vue-cli、vue-ro...

  • vue-cli3.0项目搭建

    1.搭建vue项目前提是nodejs已经安装完成。 2.安装vue脚手架 npm install -g @vue/...

  • VUE全家桶

    注意:这里只讲VUE脚手架搭建的项目首先安装开发环境,vue-cli 一键搭建vue项目是基于 Node.js 所...

网友评论

      本文标题:vue脚手架安装及项目搭建

      本文链接:https://www.haomeiwen.com/subject/ezcokqtx.html