vue项目的单独运行

最新推荐文章于 2024-07-30 17:40:26 发布
最新推荐文章于 2024-07-30 17:40:26 发布
阅读量2.4k 收藏 1
点赞数
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/pure_mind/article/details/96115988
版权

第一步
从node.js官网上下载node.js
在这里插入图片描述
安装cnpm
在命令行中输入 npm install -g cnpm --registry=http://registry.npm.taobao.org
安装vue-cli脚手架构建工具
在命令行中运行命令 cnpm install -g vue-cli
然后打开vue项目所在位置
在这里插入图片描述
Shift加右键有个在此处打开命令行窗口
在这里插入图片描述
在命令行中输入 cnpm install 加载依赖 会多出这个文件

在这里插入图片描述
在命令行中输入 cnpm run dev 就可以运行项目
在这里插入图片描述
如果端口冲突 在config 里面index.js里面port修改端口号
注意 谷歌浏览器:6000、6665-6669…非安全端口号不可反问
FireFox火狐浏览器:非80端口
在这里插入图片描述
在这里插入图片描述在这里插入图片描述

pure_mind
关注
Vue----单页面应用程序
emmmm.....
04-29 835
文章目录1 单页面应用程序1.1 什么是单页面应用程序1.2 单页面应用程序的特点1.3 单页面应用程序的优缺点1.3.1 单页面应用程序的优点1.3.2 单页面应用程序的缺点1.4 如何快速创建 vue 的 SPA 项目 1 单页面应用程序 1.1 什么是单页面应用程序 单页面应用程序（英文名：Single Page Application）简称 SPA，顾名思义，指的是一个 Web 网站中只有唯一的一个 HTML 页面，所有的功能与交互都在这唯一的一个页面内完成。 1.2 单页面应用程序的特点
运行单独的vue页面
sinat_33384251的博客
09-22 1万+
之前 需要设置过浏览器的调用，如果路径不对，会提示错误 需要全局按照vue 如果在控制台 输入 vue 提示没有这个命令 npm install -g @vue/cli-service-global 确保安装成功 输入 vue -V #有结果 就可以使用 如果要运行 hello.vue 在控制台输入：vue serve hello.vue # hello.vue 是文件名 ...
el-table支持多列同时排序
最新发布
wch19960518的博客
07-30 495
1. header-cell-style 表头单元格的 style 的回调方法，也可以使用一个固定的 Object 为所有表头单元格设置一样的 Style（解决多列排序字段。（true, false, ‘custom’），为’custom’时，代表用户希望远程排序，需要加 sort-change 事件（我这块介绍的就是值为custom的）1. @sort-change点击排序小箭头触发的事件。1. sortable 是否可以。
单独运行Vue文件
wwf1225的博客
04-13 8300
场景：想单独运行某个Vue文件，不依赖src,类似运行单独的HTML文件 1.安装vue serve 2.运行 npm install -g @vue/cli-service-global 3.安装完成之后cd到需要单独运行的Vue目录下，执行 vue serve XXX ...
如何运行单个.vue文件
热门推荐
安可心
04-09 2万+
1.全局安装Vue npm install -g @vue/cli Mac 需要在前面加 sudo。 查看Vue版本： vue -V 2.全局安装下面的扩展： npm install -g @vue/cli-service-global 3.在本地新建一个Vue文件： <template> <h1>Hello!我是安安</h1> </template> 4.在这个 .vue 文件所在的目录下运行： vue serve 5.在浏览器打开如下地址就可
在vue cli 3中单独运行.vue文件
zhaohanqq的博客
04-27 963
首先安装 npm install -g @vue/cli-service-global 然后执行命令（HelloWorld是vue文件名） npm serve HelloWorld.vue 注意：要cd到该文件下
vue修改vue项目运行端口号的方法
12-10
一、导语 最近在研究，左侧是导航，右侧是显示对应的内容，左右可单独滚动，不...记录下如何更改vue项目运行的端口号 使用webpack创建的vue项目，端口号默认是8080，可是不想用8080做项目的端口号怎么办？？ 1、找到项
Vue项目部署在Spring Boot出现页面空白问题的解决方案
12-02
如果Vue项目的`assetsPublicPath`配置为绝对路径`/`，则在刷新浏览器或直接访问子路由时，资源路径将不正确，导致页面空白。 针对这个问题，网上流行的解决方案是将`assetsPublicPath`改为相对路径`./`。这样做的...
解决vue项目运行提示Warnings while compiling.警告的问题
10-14
在开发Vue项目时，我们可能会遇到“Warnings while compiling”这样的警告。这通常是因为在项目创建过程中选择了启用ESLint，一个代码风格检查工具，用于确保代码符合一定的编码规范。如果你不希望看到这些警告或不...
运行单个vue文件
qq_34814495的博客
10-12 1825
vue单页面应用？
m0_74359467的博客
03-25 313
在 Vue.js 中，单页面应用 (SPA) 是一种 Web 应用程序，它在加载初始页面后，通过动态地更新页面的内容而不是通过重新加载整个页面来实现用户导航和交互。组件通信：通过 props 和 events 实现组件之间的通信，父组件可以向子组件传递数据，子组件可以通过 events 向父组件发送消息。总的来说，Vue.js 提供了丰富的工具和功能来帮助开发者构建高效的单页面应用，同时也提供了良好的文档和社区支持，使得开发过程更加顺畅。这样可以使代码更加清晰，易于维护和复用。
webstorm中运行单个vue文件
小翠学姐的博客
06-24 2252
https://cli.vuejs.org/zh/guide/prototyping.html#vue-serve
vue3.0基础--单独运行vue文件
03-30 6125
1.在根目录建立一个vue文件 2.vue servevue文件名 3.出现以下情况： 执行：npm install -g @vue/cli-service-global 重启项目。
如何运行一个vue文件进行预览
weixin_56071908的博客
01-31 2350
如何预览一个.vue文件进行预览呢？ 每天写个页面，都要配置脚手架，能不能像以前开发前端页面一样，写一个index.html,然后编写js，css，就可以在浏览器上运行了呢？可是我又不想舍弃vue，那么能不能全局搭建一个脚手架，供我来使用呢？ 今天翻阅文档，发现了官方文档给出了一个方案 安装 npm install -g @vue/cli @vue/cli-service-global # o...
(备忘)运行单个vue文件
今天鸭鸭不想出去玩
12-21 1144
全局安装 npm install -g @vue/cli-service-global 然后切到想运行的vue文件目录下，执行cmd 接着输入 vue serve xx.vue 然后就会出现运行地址 照着地址打开就行了
vue之独立构建和运行时构建
zengyonglan的博客
06-12 4732
1.独立构建和运行时构建2.vuejs运行时构建和独立构建的区别，分别适用于什么样的业务场景？笔记： Vue.js 的官方教程上是这么说的： * 独立构建包括编译和支持 template 选项。 它也依赖于浏览器的接口的存在，所以你不能使用它来为服务器端渲染。 * 运行时构建不包括模板编译，不支持 template 选项。运行时构建，可以用 render 选项，但它只在
vue的单页面和多页面应用
neserAImw的博客
01-18 937
Vue.js是一种流行的JavaScript框架，用于构建现代化的Web应用程序。
用脚手架搭建vue项目
07-27
使用脚手架搭建Vue项目非常方便。首先，你需要下载并安装Vue脚手架。你可以在命令行中输入以下命令进行安装：npm i -g @vue/cli \[1\]。安装成功后，你可以使用以下命令创建一个新的Vue项目：vue create my-project \[1\]。在创建项目时，你可以选择手动配置项目的工具和插件，也可以选择使用默认配置。接下来，你需要选择路由模式，推荐使用哈希模式。然后，你可以选择ESlint语法版本和语法校验的时机，推荐使用标准配置和第一个时机。你还可以选择将工具的配置保存在单独的文件中或者写在package.json中。最后，等待项目创建完成后，切换到项目目录中，并运行npm run serve命令来启动项目。打开浏览器，输入对应的URL地址，你就可以看到你创建的Vue项目了 \[1\]。 #### 引用[.reference_title] - *1* [使用脚手架创建Vue项目](https://blog.csdn.net/qq_43218707/article/details/106302074)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insertT0,239^v3^insert_chatgpt"}} ] [.reference_item] - *2* *3* [使用脚手架（Vue-Cli）快速创建一个vue项目的步骤](https://blog.csdn.net/qq_59808309/article/details/122636538)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insertT0,239^v3^insert_chatgpt"}} ] [.reference_item] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值