安装Node(脚手架)

目录

  • 一,安装node(脚手架)
    • 1.1, 配置vue.config.js
    • 1.2, vue-cli3x的目录介绍
    • 1.3, package.json
  • 最后

一,安装node(脚手架)

从官网直接下载安装即可,自带npm包管理工具。https://nodejs.org/en

在这里插入图片描述
安装之后在终端里查看查看node版本

node -V

在这里插入图片描述
安装webpack

//  安装webpack 全局安装 在开发环境中
npm install webpack -D -g

安装vue-cli3.x以上

安装vue-cli
npm install @vue/cli@4.5.17 -g
创建工程
vue create 工程名

注意
要先在盘服中创建好文件夹,然后访问
在这里插入图片描述
创建好之后创建工程名字然后选择最后一个,最后一个是自定义项目
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
我就不选择Y了,我选的是N

创建项目成功之后
在这里插入图片描述

1.1, 配置vue.config.js

工程中此文件是没有,需要在工程的根路径下自行创建。

初始化的内容如下:

module.exports = {configureWebpack:{devServer:{port:8090, // 端口open:true, // 自动打开浏览器// Mock数据before(app){}}}
}

1.2, vue-cli3x的目录介绍

vue.config.js里大概包括了配置 常用的输出路径名、跟目录、预处理、devServer配置、pwa、dll、第 三方插件等等
因为绝大部分的配置和扩展尤大大已经做好了封装的了,我们常用的开发基本可以满足,不满足的 我们自己可以自行去扩展
webpack的配置在这个属性里修改configureWebpack(Mock也是在这里面的)

在这里插入图片描述

1.3, package.json

找到这个文件package.json修改一些配置不然运行不成功
在这里插入图片描述
修改成这样
在这里插入图片描述

然后新建终端
在这里插入图片描述
然后输入:npm run serve
在这里插入图片描述
成功之后打开是这个页面
在这里插入图片描述

最后

送大家一句话:现在站在什么地方不重要,重要的是往什么方向移动!!!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/50689.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

scratch计算圆的面积和周长 2023年5月中国电子学会图形化编程 少儿编程 scratch编程等级考试四级真题和答案解析

目录 scratch计算圆的面积和周长 一、题目要求 1、准备工作 2、功能实现 二、案例分析

视频转云存的痛点

现在整个运营商体系里面,有大量的视频转云存储的需求,但是视频云存储有一个比较大的痛点,就是成本! 成本一:存储成本; 我们以1000路2M视频转云存,存储时间为90天为例(B端存储时间有…

windows下nginx配置为服务

​ 1.下载winswx。 下载地址&#xff1a;winsw下载 2.解压后将其重命名为“nginx-service”,并将其放到nginx目录下。 3.新建一个文本文档内容如下&#xff1a;&#xff08;里面的路径根据自己的情况修改&#xff09; <service> <id>nginx</id> <name&…

Matplotlib学习笔记

Matplotlib数据可视化库 jupyter notebook优势 画图优势&#xff0c;画图与数据展示同时进行。数据展示优势&#xff0c;不需要二次运行&#xff0c;结果数据会保留。 Matplotlib画图工具 专用于开发2D图表以渐进、交互式方式实现数据可视化 常规绘图方法 子图与标注 想要…

高性能网络模式-Reactor

事实上&#xff0c;Reactor 模式也叫Dispatcher模式&#xff0c;即I/O 多路复⽤监听事件&#xff0c;收到事件后&#xff0c;根据事件类型分配&#xff08;Dispatch&#xff09;给某个进程/线程。Reactor 模式也是一种非阻塞同步网络模式。 Reactor 模式主要由 Reactor部分和处…

OLED透明屏报价:如何选择高性价比的产品

OLED透明屏作为一项创新的显示技术&#xff0c;其透明度和高清晰度的特点使其在各个领域得到了广泛应用。 然而&#xff0c;在购买OLED透明屏时&#xff0c;消费者往往会面临多样的报价和产品选择。本文将基于相关数据和报告&#xff0c;为您详细介绍OLED透明屏的报价因素&…

银行数字化转型程度-根据年报词频计算(2012-2021年)

银行数字化转型程度是根据银行年报中的数字化相关词频计算所得的数据。这一数据包括数字化词频关键词、以及数字化转型程度&#xff0c;反映了银行数字化转型的程度和进展情况。从经济学研究的角度来看&#xff0c;这一数据具有重要的参考价值。 首先&#xff0c;银行数字化转…

SHELL 基础 入门(三) Bash 快捷键 命令执行顺序,详解通配符

目录 Bash 常用快捷键 输入输出重定向 << 用法 输出重定向 命令执行顺序 ; 分号 && || 通配符 传统通配符 &#xff1f; * [ ] [ - ] [ ^ ] 常用字符 强调 &#xff1a; { } 生成序列 Bash 常用快捷键 Ctrl A 把光…

Matlab绘制灰度直方图

直方图是根据灰图像绘制的&#xff0c;而不是彩色图像通。查看图像直方图时候&#xff0c;需要先确定图片是否为灰度图&#xff0c;使用MATLAB2019查看图片是否是灰度图片&#xff0c;在读取图片后在MATLAB界面的工作区会显示读取的图像矩阵&#xff0c;如果是&#xff0c;那么…

Redis过期数据的删除策略

1 介绍 Redis 是一个kv型数据库&#xff0c;我们所有的数据都是存放在内存中的&#xff0c;但是内存是有大小限制的&#xff0c;不可能无限制的增量。 想要把不需要的数据清理掉&#xff0c;一种办法是直接删除&#xff0c;这个咱们前面章节有详细说过&#xff1b;另外一种就是…

11、vue3

一、为什么要学 Vue3 1.1 为什么要学 Vue3 1.2 Vue3的优势 1.3 Vue2 选项式 API vs Vue3 组合式API Vue3 组合式API vs Vue2 选项式 API 二、create-vue搭建Vue3项目 2.1 认识 create-vue 2.2 使用create-vue创建项目 前提环境条件 已安装 16.0 或更高版本的 Node.js node -…

大学资产管理,这个细节真的很绝!

无论是个人还是企业&#xff0c;资产都是其成功的基石。通过资产管理系统&#xff0c;个人可以更好地管理他们的投资组合&#xff0c;实现财务目标。 对于企业而言&#xff0c;资产管理系统有助于提高资源利用效率&#xff0c;减少损失和浪费&#xff0c;优化生产和运营流程。 …

AI在日常生活中的应用:从语音助手到自动驾驶

文章目录 AI的定义和发展AI在日常生活中的应用1. **智能语音助手**2. **智能家居**3. **智能医疗**4. **自动驾驶** 代码示例&#xff1a;使用Python实现基于机器学习的图片分类AI的未来前景结论 &#x1f389;欢迎来到AIGC人工智能专栏~探索AI在日常生活中的应用 ☆* o(≧▽≦…

RT1052的EPWM

文章目录 1 EPWM介绍1.1 引脚1.2 时钟1.3 比较寄存器 2 函数 1 EPWM介绍 RT1052 具有 4 个 eFlexPWM(eFlexWM1~eFlex_PWM4)。 每个 eFlexPWM 可以产生四路互补 PWM即产生 8 个 PWM&#xff0c;也可以产生相互独立的 PWM 波。四路分别是模块0-3每个 eFlexPWM 具有各自的故障检…

基于Googlenet深度学习网络的交通工具种类识别matlab仿真

目录 1.算法运行效果图预览 2.算法运行软件版本 3.部分核心程序 4.算法理论概述 5.算法完整程序工程 1.算法运行效果图预览 2.算法运行软件版本 matlab2022a 3.部分核心程序 ....................................................................................% 获…

开黑啦kook 机器人开发 PHP swoole Liunx 服务器(宝塔)

安装环境 PHP 拓展 直接使用 宝塔一键安装 &#xff08;Windows系统不支持&#xff09; 设置命令行的PHP版本避免执行脚本时 获取不到 swoole 检查swoole是否安装成功 获取官方SDK GitHub - kaiheila/php-bot: 开黑啦机器人的php版本https://github.com/kaiheila/php-bot 配…

2023年大数据与区块链国际会议 | EI、Scoups检索

会议简介 Brief Introduction 2023年大数据与区块链国际会议&#xff08;ICBDB 2023&#xff09; 会议时间&#xff1a;2023年11月17 -19日 召开地点&#xff1a;中国西安 大会官网&#xff1a;www.icobdb.org 2023年大数据与区块链国际会议&#xff08;ICBDB 2023&#xff09;…

《Go 语言第一课》课程学习笔记(十一)

控制结构 if 的“快乐路径”原则 针对程序的分支结构&#xff0c;Go 提供了 if 和 switch-case 两种语句形式&#xff1b;而针对循环结构&#xff0c;Go 只保留了 for 这一种循环语句形式。 if 语句 if 语句是 Go 语言中提供的一种分支控制结构&#xff0c;它也是 Go 中最常…

Aurora 8B/10B

目录 1. Overview2. Feature List2. Block Diagram3. PDU Transmission Procedure3.1. User InterfaceFraming InterfaceStreaming Interface 3.2. Clock Compensation3.3. Aurora 8B/10B Frame Gen3.4. 8B/10B Transmission Code 4. PDU Reception Procedure5. Flow Control5.…

Android OpenCV(七十五): 看看刚”转正“的条形码识别

前言 2021年,我们写过一篇《OpenCV 条码识别 Android 平台实践》,当时的条形码识别模块位于 opencv_contrib 仓库,但是 OpenCV 4.8.0 版本开始, 条形码识别模块已移动到 OpenCV 主仓库,至此我们无需自行编译即可轻松地调用条形码识别能力。 Bar code detector and decoder…