vue项目运行相关知识
-
mac如何运行VUE项目大家好,我是灰大狼. 最近在做一个前后端分离的项目,前端用的是vue,由于以前没有接触过,所以今天初步学习了下vue,vue我就不介绍了,这里主要给大家分享的是vue项目如何运行,由于我用的是mac,跟windows安装环境不太一样,这里主要说的是mac下如何安装环境以及运行一个vue项目。 安装node.js 下载 进入nodejs官网下载node.js,我下载的版本是12.14.0 安装 按照步骤一步步来,即可安装完成,此时node和npm都一起给安装好了 验证 node -v #查看node版本 npm -v #查看npm版本 由
-
Vue项目开发环境安装、项目构建运行、打包部署详解1. 背景 Vue工程化项目环境配置还是比较麻烦的,本篇来详细的记录下从0开始的安装、构建、打包、运行全过程。 2. 整体步骤 第一,安装Node.js,这个是前端工程化项目运行的基础环境。 第二,安装Vue,使我们前端开发环境可以支持Vue开发。 第三,安装Vue CLI,这是Vue提供的交互时的项目脚手架,有点难理解是吧,其实就是一个快速构建Vue工程的小工具,通过Vue CLI,开发人员可以使用命令行或者可视化界面快速构建Vue工程项目。 第四,我们通过Vue CLI提供的可视化工具来构建一个Vue工
-
如何运行vue项目(维护他人的项目)假如你是个小白,在公司接手他人的项目,这个时候,该怎么将这个项目跑通? 前提: 首先,这个教程主要针对vue小白,并且不知道安装node.js环境的。言归正传,下面开始教程:在维护项目之前,需要把所有的环境搭建好,这里我就不多说了,看这篇就够了:十分钟上手-搭建vue开发环境(新手教程)https://www.jianshu.com/p/0c6678671635 好了,再重复具体不嫌麻烦的把步骤操作一遍,做技术就得孰能生巧,一遍又一遍不断的重复 如下: 1:安装cnpm 由于npm有些资源被屏蔽或者是国外资源的原因
-
Vue-cli3.0项目创建简介之前写过一篇文章Vue-cli项目创建,主要是针对Vue-cli3.0版本之前的,由于现在Vue-cli版本更新到了3.0,而且创建项目的一些情况也发生了变化,所以本篇将在基于Vue-cli3.0以上版本创建项目,大家可以参考一下Vue-cli2.0版本(这里的Vue-cli3.0版本之前统称为2.0版本)和Vue-cli3.0版本的不同之处,不要混淆了。大家也可以进入Vue-cli3官网进行查看相关信息。vue.png安装说明这里不介绍Vue-cli3.0项目所需的Node.js那些安装了,但是Node.js版本必须是8.9 或更高版本(推荐 8.11.0+),大家还不清楚的话就去查看我之前写的文章Vue-cli项目创建,会有说明。在安装之前我们来介绍一下Vue-CLI:通过 @vue/cli 搭建交互式的项目脚手架。通过 @vue/cli + @vue/cli-service-global 快速开始零配置原型开发。一个运行时依赖 (@vue/cli-service),该依赖:可升级;基于 webpa
vue项目运行相关课程
vue项目运行相关教程
- 3.3 运行及发布项目 如果是通过 vue-cli 进行开发,可以在命令行运行下面代码来运行发布项目。npm run dev:custom mp-dingtalk npm run build:custom mp-dingtalk如果通过 HBuilderX 进行开发, HBuilderX 开发工具会根据package.json 文件中的配置,在运行和发行菜单下生成自定义菜单。如果package.json中的配置添加完成后,HBuilderX 开发工具没有帮我们自动生成自定义菜单,我们可以先编译一下项目,比如点击运行–运行到内置浏览器。编译完成后,自定义菜单就会出现了。最后我们点击对应的菜单编译运行项目就可以了,如下图:
- 3.4 运行项目 我们来将上面添加的 HelloWorld 运行起来吧。1. 运行到浏览器点击工具栏中的运行->运行到浏览器->选择相应的浏览器运行:选择浏览器之后,HBuilderX 开发者工具会出现正在编译的提示,第一次运行会慢一点,编译成功后,自动打开浏览器并显示项目的页面。可以看到 HelloWorld 打印出来了。2. 运行到内置浏览器点击工具栏中的运行->运行到内置浏览器,会出现一个 Web 浏览器的弹出框,第一次打开会比较慢,需要耐心等一会才会出现项目的页面。3. 运行到手机或模拟器使用这个功能需要先用数据线连接手机,否则会提示“未检测到手机或模拟器,请稍后再试”。数据线连接手机后,我们再点击工具栏中的运行->运行到手机或模拟器。系统会自动在我们手机上面安装 HBuilderX 手机版。在手机上面打开 HBuilderX 手机版,就可以看到 HelloWorld 页面。Tips:如果打开手机版 HBuilderX 没有看到正确的页面,可以关掉手机应用进程,重新打开看一下。如果编译出错,点击查看工具栏中的运行->运行到手机或模拟器->真机运行常见故障排除指南,排除错误。4. 运行到小程序模拟器第一次使用小程序模拟器,需要先安装小程序开发者工具,并在工具栏->运行->运行到小程序模拟器->运行设置中设置小程序开发者工具安装的路径。在微信开发者工具里运行点击工具栏中的运行->运行到小程序模拟器->微信开发者工具,即可在微信开发者工具里面体验 uni-app。在 HBuilderX 里面开发,微信开发者工具里面就可以看到实时效果。uni-app 会将项目编译到根目录的 unpackage/dist 目录下面。Tips:如果没有成功运行可以做下面的操作。如果微信开发者工具已经打开,关闭微信开发者工具,重试一下;如果还是不行的话,建议将微信开发者工具升级到最新版本;最后如果自动启动微信开发工具失败,可以手动在开发者工具中打开HBuilderX控制台中提示的项目路径。在百度开发者工具里运行点击工具栏的运行->运行到小程序模拟器->百度开发者工具,在百度开发者工具中打开 HBuilderX 控制台中提示的项目路径,就可以在百度开发者工具中体验 uni-app。在支付宝小程序开发者工具里运行点击工具栏的运行->运行到小程序模拟器->支付宝小程序开发者工具,在支付宝小程序开发者工具中打开 HBuilderX 控制台中提示的项目路径,就可以在支付宝小程序开发者工具中体验 uni-app。在字节跳动开发者工具里运行点击工具栏的运行->运行到小程序模拟器->字节跳动开发者工具,在字节跳动开发者工具中打开 HBuilderX 控制台中提示的项目路径,就可以在字节跳动开发者工具中体验 uni-app。
- 3. 运行项目 我们打开之前通过脚手架创建的项目,在项目的根目录下运行:npm run serve出现界面后:我们可以打开浏览器预览项目:
- 4. vue-cli 命令行创建项目 我们在终端通过 vue-cli 命令行创建 uni-app 项目,在创建项目之前,需要保证电脑已经配置了 nodejs 环境。
- 3.1 创建 uni-app 项目 直接在 HbuilderX 中创建项目,点击菜单栏-文件-新建-项目,出现创建项目的界面,选择 uni-app 项目,并选择默认模板。当然如果已经安装了 vue 运行环境,也可以使用 cli 方式创建项目,执行 vue create -p dcloudio/uni-preset-vue uniappPro 即可创建。
- 2.4 运行这个项目 在项目创建好之后,我们就来运行这个项目。在 idea 中点击Add Configuration按钮。在弹出的界面点击小+号,然后选择 Tomcat Server -> Local。在 Tomcat Server 界面的 Deployment 页签,点击小+号,选择Artifact… ,并在弹出的窗口中,选择mallweb:war exploded,并在Application context中输入/index ,最后点击OK按钮。点击Add Configuration 旁边的三角形按钮,启动项目,项目启动后控制台会输出如下日志产生。项目启动成功后,我们在浏览器中输入地址http://localhost:8080/index/,可以看到项目的欢迎页面。至此,我们的项目已经创建并启动完成。
vue项目运行相关搜索
-
vacuum
vagrant
val
validationgroup
validationsummary
vals
valueof
values
vant
variables
vb
vb if else
vb if语句
vb net
vb net 教程
vb net 数据库
vb net教程
vb net下载
vb 教程
vb 数组