【vue】 创建一个vue工程

最新推荐文章于 2022-11-14 16:42:29 发布
最新推荐文章于 2022-11-14 16:42:29 发布
阅读量169 收藏
点赞数
分类专栏： VUE 文章标签： vue vue工程
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Eye_Me/article/details/102502648
版权

下面是对vue从安装工具的安装和工程的创建的详细流程。（安装的基础需要安装node.js环境，如果不知道的朋友可以 点击查看vue环境的搭建）

安装vue-cli

 

 

创建一个基于 webpack 模板的新项目

 

 

除了在选择vue-router 的时候选y ，其他都选no ，因为vue工程中需要router 路由来进行页面跳转。

创建完毕后，进入项目的目录

 

 

 

运行项目

 

 

浏览器输入localhost:8080 

出现vue图片则访问成功。到这里 就已经算创建一个完整的vue工程了。

创建的vue工程在github上有，有兴趣的朋友可以参考一下

 github上的vue工程

 

之后我会写更多关于vue的一些知识和坑的处理，如果有小伙伴不懂的可以评论区问我，我会及时回复的☺

与一人同游_
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
如何创建一个Vue工程
SQ_1224的博客
08-30 3056
如何创建一个Vue工程
如何搭建一个vue项目
weixin_30500663的博客
05-02 943
一、安装node环境 　　1、下载地址为：https://nodejs.org/en/ 　　2、检查是否安装成功：如果输出版本号，说明我们安装node环境成功 　　 　　3、为了提高我们的效率，可以使用淘宝的镜像：http://npm.taobao.org/ 　　输入：npm install -g cnpm –registry=https://registry.npm.taobao.or...
vue创建工程
UangIng的博客
05-05 239
（一）在vue搭建之前一定先要安装node.js，因为vue的运行是要依赖于node的npm管理工具来实现的，我下载的都是最新版本，地址：https://nodejs.org/zh-cn/download/ 查看node和npm是否安装成功：node -v 和 npm -v （二）由于在国内使用npm速度会很慢，所以推荐使用淘宝镜像： npm install -g cnpm --registr...
vue 创建工程
fivestar2009的博客
08-26 523
vue3创建遇到的问题
Vue创建工程
qq_42696004的博客
09-02 45
首先以管理员打开CMD控制台，跳转到创建文件的目录。 #创建一个名为Hello-vue的工程 vue init webpack Hello-vue 安装依赖 #进入工程目录 cd Hello-vue #安装 vue-router路由 npm install vue-router --save-dev #安装elementUI npm i element-ui -S #安装依赖 npm install #安装SASS加载器 cnpm install sass-...
vue使用vue-cli快速创建工程
01-19
本文介绍了vue使用vue-cli快速创建工程，分享给大家，具体如下： vue-cli安装 npm i vue-cli -g ...配置完成后，可以看到目录下多出了一个项目文件夹，里面就是 vue-cli 创建的一个基于 webpack-simple 的 vue.
vue下载及创建vue工程
11-30
Vue 是一个流行的前端框架，由 Evan You 于 2014 年创建，旨在简化 Web 应用程序的开发过程。以下是关于 Vue 下载及创建 Vue 工程的知识点： 安装 Node.js Node.js 是一个 JavaScript 运行时环境，Vue 需要 Node....
一个空白的vue工程
08-03
在“一个空白的vue工程”中，我们主要讨论的是如何从零开始搭建一个Vue项目，并解决与旧版浏览器（如IE）的兼容性问题。 首先，创建Vue项目通常需要借助Vue CLI（命令行界面），它是一个官方提供的工具，可以快速...
vue创建工程图文版
07-20
要开始一个 Vue 工程，首先需要确保已经安装了 Node.js 和 npm（Node 包管理器），因为 Vue CLI（命令行工具）依赖这两个组件。以下是创建 Vue 项目的详细过程： 1. **安装 Vue CLI**： 打开终端或命令提示符，...
vue创建一个工程项目
1
07-30 95
打开终端 1、vue create 项目名字 弹出来的选择默认的第一项，vue2项目，或者最后一项自己配置也行。 2、创建项目成功后，启动项目服务器，这个时候要cd 项目名称，进入项目，才可以使用命令启动服务器，否则会报错。 npm run serve 启动服务器 3、服务器启动成功后，会有两个链接，一个local，一个network，随便点击就可以打开页面 到此为止一个项目就新建成功了 如果想要退出终端打开服务的那一页 先ctrl + d 再ctrl+c即可。 ...
创建VUE工程
carzyPianist的博客
07-06 92
1.创建一个名为hello-vue的工程 cmd输入命令：vue init webpack hello-vue 2.安装依赖 需要安装:vue-router,element-ui,sass-loader和node-sass四个插件 cmd命令： 2.1 安装vue-router 2.2 安装 element-ui 2.3 安装依赖 2.4 安装 SASS 加载器 2.5 运行项目 $ npm run dev 项目运行成功之后： ...
创建 Vue 工程
qq_18344549的博客
11-14 111
创建vue
Vue建立工程
rrrrr44444的博客
05-21 263
第一步：新建文件夹 第二步：vue init webpack stuproject 第三步：交互，按如下选择： 1、Project name 2、Project description 3、Author 4、Vue build runtime only 5、Install vue-router? Yes 6、Use ESLint to lint your code? No 7、Set up unit tests No 8、Setup e2e tests with Nightwatch?
vue创建一个项目
weixin_55869175的博客
03-13 1223
vue脚手架创建一个vue项目
vue如何新建一个项目
wanghongyan2011的博客
06-30 111
vue创建项目（npm安装→初始化项目） 第一步npm安装 首先：先从nodejs.org中下载nodejs 双击安装，在安装界面一直Next 直到Finish完成安装。 打开控制命令行程序（CMD）,检查是否正常 使用淘宝NPM 镜像 大家都知道国内直接使用npm 的官方镜像是非常慢的，这里推荐使用淘宝 NPM 镜像。 $ npm install -g cnpm --registry=https://registry.npm.taobao.org 这样就可以使用cnpm 命令来安装模块
如何创建 Vue 工程
Kevin_CY_DLJ的博客
12-11 317
前言 Vue框架有两种使用方式： 1、一种是通过在HTML文件中引入 vue.js 的文件 2、另一种是通过脚手架 vue-Cli 创建一个 vue 工程 今天我要介绍的就是第二种方式 安装三个软件：VsCode，nodejs，cmder，其中 cmder 是用于代替 cmd ，非必须。 第一步：准备相应环境 1.webpack [ 在 cmd 或 cmder 中完成 ] npm insta...
vue创建项目
Summer_i的博客
10-10 383
1.环境要求：  安装有 Node.js、 vue、 vue-cli 。 2.在你想创建项目的文件夹  然后进入命令行 输入     vue init webpack projectName 3. 图片如上 4.eslint 要点no   karma+mocha no , tests no   5.vue项目默认就创建完了，  缺哪个包 就 npm install xx
创建一个 SpringBoot+Vue 工程
最新发布
03-23
创建一个 SpringBoot Vue 工程需要以下步骤： 1. 首先，您需要安装 Java 和 Node.js 环境。 2. 接着，您可以使用 Vue CLI 创建一个 Vue 工程，命令如下： ``` vue create my-project ``` 3. 然后，您需要在 ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值