HBuilderX搭建Vue项目

2024-04-15 19:51:00

HBuilderX搭建Vue项目

1. node安装

vue的运行依赖node.js，需要先安装node.js。
下载地址：https://nodejs.org/en/download/
不要改安装路径，改了后续可能会出很多问题，根据安装向导安装即可。

1.1 查看node版本

1.2 查看npm版本

升级npm版本：npm install npm -g

1.3 使用npm镜像

npm 版本需要大于 3.0，如果低于此版本需要升级它：
npm install -g cnpm --registry=https://registry.npm.taobao.org
这样就可以使用cnpm 命令来安装模块了：

1.4 安装vue相关

1.4.1

cnpm install vue

1.4.2

全局安装脚手架：cnpm install --global vue-cli

查看脚手架是否安装成功：

1.5 命令行初始化项目

vue init webpack “项目名称”；
这里需要进行一些配置，默认回车即可；
对于语法检查可选择no；

1.5.1 命令行启动项目

进入项目，安装并运行；

2. 搭建项目

新建项目——选择vue项目，HBuilderX就会自动创建好项目。

生成的vue项目结构：

3. HBuilderX配置

3.1 运行配置

3.2 工程安装npm

第一次需要先下载插件，下载完毕再次执行npm install；

安装比较慢，请安心等待。
安装成功之后，项目目录下会多出一个node_modules文件夹，这是核心吧。

4. 项目启动

安装：npm install;
编译：npm run build;
启动：npm run server;

访问：http://localhost:8080/

HBuilderX搭建Vue项目相关推荐

Vue-CLI + Webpack 搭建 Vue 项目最全分析
一.vue-cli介绍 vue-cli是一个用于快速搭建vue项目的脚手架. 二.vue-cli安装.更新安装过nodeJs .cnpm 后,全局安装vue-cli(以后其他项目可直接使用): c ...
MAC电脑使用vue-cli脚手架搭建vue项目；mac使用脚手架vue-cli搭建vue项目
windows搭建vue项目看这篇
搭建 vue项目（Windows + 命令行 + vsCode）
1.win键 + R ,输入CMD打开命令行. 2.输入node -v 查看node.js是否安装,如果输出版本号,则进行下一步,否则安装node.js. 下载地址:https://nodejs.or ...
搭建vue项目环境以及创建一个简单的vue的demo
一.vue-cli脚手架的搭建步骤 1.首先,确定你的电脑上已经安装了nodejs,可以使用npm包管理器安装环境,如果还没有安装node环境,则需要安装node.js 这个很简单默认点击安装 ...
关于搭建Vue项目的顺序及遇到的问题
关于搭建Vue项目的顺序前言:笔者在搭建Vue项目中遇到了许多问题,当最后解决的时候,仍然对这个过程的来龙去脉极为模糊,在这里从最开始搭建nodejs开始到最后Vue项目搭建完成进行一个一条龙的总结 ...
VSCode搭建Vue项目及服务器部署
一.安装nodeJs 在我之前的博客<idea搭建vue-cli项目>里有详细安装教程,这里进入! 二.在VSCode搭建Vue项目 1.安装全局脚手架 npm i -g @vue/cli ...
Vue入门 - 环境搭建Vue项目创建
Vue起步:从零开始搭建一个完整的Vue项目一.安装Node环境 1.下载Node.js安装包并安装 2.环境变量的配置二.搭建vue项目环境一.安装Node环境 1.下载Node.js安装包并 ...
教你如何搭建vue项目
笔者工作也有一些时间,需要用vue写项目时也总是项目组长已经把项目搭建好了, 偶尔心血来潮想试着自己搭建一个vue项目我们搭建vue项目呢主要是用到了vue-cli来搭建,但是前提是必须要已经安装好 ...
从零开始使用webpack 搭建vue项目
从零开始使用webpack 搭建vue项目 1 创建项目 npm init 生成 package.json 创建 index.html webpack.confug.js project-name|- ...
HbuilderX开发vue项目(入门)
一.安装node 1.下载地址为:https://nodejs.org/en/(下面有镜像) 2.一路点击Next,检查是否安装成功 3.后续操作官网下载比较慢,可以使用淘宝的镜像:http://np ...

最新文章

热门文章