2020-10-20 vue项目搭建

it2023-05-31  70

创建一个Vue项目

搭建项目前首先安装一下node以及npm node安装地址 npm安装地址

安装Git(Git是一个分布式版本控制系统) http://www.cnblogs.com/wj-1314/p/7993819.html

1.进入vue.js官网 https://cn.vuejs.org/v2/guide/installation.html

确认自己电脑上是否安装好了node npm ,我们可以在命令行中 输入 【node --version 】 查看node版本 【npm --version】查到npm版本 如果都能输出他们的版本号 及说明 node 和npm 安装成功:

安装Vue :在Vue 官网中对安装做出了详细介绍

Vue 提供了一个官方的 CLI,为单页面应用 (SPA) 快速搭建繁杂的脚手架。它为现代前端工作流提供了 batteries-included 的构建设置。只需要几分钟的时间就可以运行起来并带有热重载、保存时 lint 校验,以及生产环境可用的构建版本。更多详情可查阅 Vue CLI 的文档。

#全局安装 vue-cli npm install --global vue-cli #创建一个基于 webpack 模板的新项目 vue init webpack my-project #安装依赖,goo go go cd my-project npm install npm run dev

进行Vue安装 输入:

【npm install --global vue-cli】 (-global 意思是全局安装 这样Vue会安装到 安装node 的文件夹下 否则会安装到 当前目录) 验证安装成功 输入 【Vue --version】,出现Vue版本号,则说明 Vue 安装成功

创建项目及依赖安装

现在开始使用Vue创建项目: (可以先进入自己想要创建项目的文件夹中)

创建一个基于 webpack 模板的新项目 【vue init webpack my-project】 my-project(项目文件夹名)

执行这个命令后命令行会出现一些需要你填写选择的项目属性 should we run npm install… (这句话是在问是否在工程创建后就去跑 npm 安装依赖 这里面有几个选项 第一个是【是】 也可以选最后一个 稍后自己就安装依赖 即 在命令行执行npm install 命令 ) 如上图所示,vue项目创建成功了,你可以在你选择的文件加下看到这些文件 (其中node-modules是依赖安装后出现的,没安装依赖以前是没有node_modules文件夹的)

运行测试

进入文件夹 执行运行命令

cd project2

npm run dev

最新回复(0)