npmvue详解

news2025/3/2 1:27:47

1、npm是node.js的一个软件依赖包管理工具

2、当前目录下面一般会有一个package.json文件

3、npm install 会去按照package.json文件中的依赖去下载依赖包 默认会下载到当前目录中的node_modules文件夹下,-g会进行全局安装

4、package.json文件中有两种依赖关系 dependencies依赖和devDependencies开发依赖

dependencies当别人引用我们这个包的时候,包内的依赖包也会被下载下来。
devDependencies在别人引用的时候不会被 npm 下载。
npm install 默认会安装 dependencies 字段和 devDependencies 字段中的所有模块,
如果使用 --production 参数,可以只安装 dependencies 字段的模块。

5、install 命令可以使用不同参数,指定所安装的模块属于哪一种性质的依赖关系,即出现在 packages.json 文件的哪一项中。

–save:模块名将被添加到 dependencies,可以简化为参数 - S。
–save-dev:模块名将被添加到 devDependencies,可以简化为参数 - D。

6、npm run

package.json文件中有一个 scripts 字段,可以用于指定脚本命令,供 npm run 直接调用。

7、scripts 脚本,顾名思义,就是一些脚本代码,可以通过 npm run script-key 来调用

8、通过使用 npm init 可以根据交互式回答产生一个符合标准的 package.json。创建一个 index.js 作为包的接口, 一个简单的包就制作完成了。

9、输入命令:npm config set registry=https://registry.npm.taobao.org

输入命令:npm config list 显示所有配置信息,我们关注一个配置文件

10、查看本地模块 npm list 查看全局模块 npm list –global

11、全局下载 vue vue-router

npm install vue -g
npm install vue-router -g

12、非全局下载 npm install vue npm install vue-router

13、vue-cli 是vue.js的脚手架,是一个vue项目管理的工具,用于自动生成vue.js+webpack的项目模板,

分为vue init webpack-simple 项目名 和vue init webpack 项目名 两种。
vue-cli工具是内置了模板包括 webpack 和 webpack-simple,前者是比较复杂专业的项目

14、全局安装脚手架 npm install vue-cli –g

15、vue初始化项目

1:vue初始化项目 vue init webpack vue01
2:安装依赖npm install
3:启动项目 npm run dev

16.vue -V 显现版本

17、found 101 vulnerabilities (76 low, 9 moderate, 15 high, 1 critical)

run npm audit fix to fix them, or npm audit for details

18、在vue中,通过 import xxx from xxx路径 的方式导入文件,不光可以导入js文件。

“xxx”指的是为导入的文件起一个名称,不是指导入的文件的名称,相当于变量名。
“xxx路径”指的是文件的相对路径。

19、导入组件

import createOA from ‘@/components/createOA’
import createOA from ‘…/components/createOA’

20、使用@方式以根目录的方式定义相对路径

vue在webpack.base.conf.js文件中有相关配置

21、在组件中导入js文件 import {geoCoordMap,data} from ‘…/assets/js/map.js’

import map from ‘…/assets/js/map.js’ js可以省略

22、只有模块被导出了(export)才能被引入(import)

23、export与export default 均可用于常量,函数,文件,模块的导出,都可以用import导入

24、export可以有多个,export default 只能有一个

通过expor方式导出时,在导入的时候要加{},export default则不需要
使用export default 为模块指定默认输出,导入时只需要知道文件名即可

25、组件属性

1.name:允许组件调用自己,
2.data(){return {}},
3.created(){}创建之后调用的函数,
4.methods:{
方法名:function(){},
}

26、目录详解

在这里插入图片描述

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

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

相关文章

kubeSphere DevOps部署vue项目

devops部署vue项目 🌔环境说明🌏创建DevOps工程🌏填写流水线信息🌏创建流水线 🌔部署应用所需脚本JenkinsfileDockerfile 🌔脚本一些参数如何设置说明🌏deploy.yaml中的:imagePullSecrets:name属…

Ovtio不同版本下载

关注 M r . m a t e r i a l , \color{Violet} \rm Mr.material\ , Mr.material , 更 \color{red}{更} 更 多 \color{blue}{多} 多 精 \color{orange}{精} 精 彩 \color{green}{彩} 彩! 主要专栏内容包括: †《LAMMPS小技巧》: ‾ \textbf…

Windows python下载

1、下载 进入到地址:https://www.python.org/dowmloads 可以直接下载最新的版本 或者点击Windows,查看下方更多的版本 点击文档就下载下来啦 2、安装 双击下载的文件,勾选Add python.exe to PATH添加到环境变量中,选择Coutomi…

NLP技术在搜索推荐场景中的应用

NLP技术在搜索推荐中的应用非常广泛,例如在搜索广告的CTR预估模型中,NLP技术可以从语义角度提取一些对CTR预测有效的信息;在搜索场景中,也经常需要使用NLP技术确定展现的物料与搜索query的相关性,过滤掉相关性较差的物…

milvus安装及langchain调用

milvus安装及langchain调用 安装milvus安装docker-compose安装milvus安装可视化界面attu 通过langchain调用milvus安装langchain安装pymilvus调用milvus 安装milvus 安装docker-compose 下载文件 curl -L https://github.com/docker/compose/releases/download/1.21.1/docke…

【QT】QMessageBox 弹出消息框,对话确认框(确定/取消)

1.无互动 QMessageBox::information(nullptr,"信息","登陆成功");2.互动:确定、取消 QMessageBox::StandardButton box; box QMessageBox::question(this, "提示", "确定要添加吗?", QMessageBox::Yes|QMessageBox::…

【论文阅读笔记】MobileSal: Extremely Efficient RGB-D Salient Object Detection

1.介绍 MobileSal: Extremely Efficient RGB-D Salient Object Detection MobileSal:极其高效的RGB-D显著对象检测 2021年发表在 IEEE Transactions on Pattern Analysis and Machine Intelligence。 Paper Code 2.摘要 神经网络的高计算成本阻碍了RGB-D显着对象…

数据结构与算法教程,数据结构C语言版教程!(第三部分、栈(Stack)和队列(Queue)详解)六

第三部分、栈(Stack)和队列(Queue)详解 栈和队列,严格意义上来说,也属于线性表,因为它们也都用于存储逻辑关系为 "一对一" 的数据,但由于它们比较特殊,因此将其单独作为一章,做重点讲解。 使用栈…

vue3 - 自定义弹框组件

写了一个弹框组件 <template><transition name"modal-fade"><div v-if"showFlag" class"myModal"><div class"content"><div class"topBox"><div class"leftTitle"><spa…

爬虫—抓取表情党热门栏目名称及链接

爬虫—抓取表情党热门栏目名称及链接 表情党网址&#xff1a;https://qq.yh31.com/ 目标&#xff1a;抓取表情党主页的热门栏目名称及对应的链接&#xff0c;如下图所示&#xff1a; 按F12&#xff08;谷歌浏览器&#xff09;&#xff0c;进入开发者工具模式&#xff0c;进行…

机器学习数据处理

欢迎关注博主 Mindtechnist 或加入【Linux C/C/Python社区】一起学习和分享Linux、C、C、Python、Matlab&#xff0c;机器人运动控制、多机器人协作&#xff0c;智能优化算法&#xff0c;滤波估计、多传感器信息融合&#xff0c;机器学习&#xff0c;人工智能等相关领域的知识和…

【图形学】探秘图形学奥秘:DDA与Bresenham算法的解密与实战

​&#x1f308;个人主页&#xff1a;Sarapines Programmer&#x1f525; 系列专栏&#xff1a;《图形学 | 图像解码》⏰诗赋清音&#xff1a;云生高巅梦远游&#xff0c; 星光点缀碧海愁。 山川深邃情难晤&#xff0c; 剑气凌云志自修。 ​ 目录 &#x1f30c;1. 初识模式识别…

28 星际旋转

效果演示 实现了一个太阳系动画&#xff0c;其中包括了地球、火星、金星、土星、水星、天王星、海王星以及火卫二号等行星的动画效果。太阳系的行星都被放在一个固定的容器中&#xff0c;并使用CSS动画来实现旋转和移动的效果。当太阳系的行星绕着太阳运行时&#xff0c;它们会…

鸿蒙开发-UI-组件-状态管理

鸿蒙开发-序言 鸿蒙开发-工具 鸿蒙开发-初体验 鸿蒙开发-运行机制 鸿蒙开发-运行机制-Stage模型 鸿蒙开发-UI 鸿蒙开发-UI-组件 文章目录 前言 一、什么是状态管理 二、管理组件拥有的状态 1.组件内状态 State装饰器 2.父子组价单向同步 Prop装饰器 3.父子双向同步 Link装…

Gitlab中的CICD的使用方法

一、CI/CD执行机制 二、离线安装gitlab-runner 下载相应版本的gitlab-runner &#xff08;下载地址&#xff1a;https://packages.gitlab.com/runner/gitlab-runner&#xff09; dpkg -i gitlab-runner_12.8.0_amd64.debgitlab-runner register第3步中需要的信息可从下图所示…

mysql关于创建表的小试题

目录 例题&#xff1a; 解题思路及步骤&#xff1a; 实验步骤&#xff1a; 步骤一&#xff1a;创建数据库 步骤二&#xff1a;创建表 步骤三&#xff1a;插入数据 例题&#xff1a; 1、创建一个英雄表(hero)&#xff0c;管于四大名著的主键 nam…

翻译: Streamlit从入门到精通 基础控件 一

这个关于Streamlit的教程旨在帮助数据科学家或机器学习工程师&#xff0c;他们不是网络开发者&#xff0c;也不想花费数周时间学习使用这些框架来构建网络应用程序。 1. 什么是Streamlit&#xff1f; Streamlit是一个免费且开源的框架&#xff0c;用于快速构建和共享美观的机器…

基于Go框架,Cloudreve个人免费开源网盘系统源码,支持云存储(七牛、阿里云OSS、腾讯云COS、又拍云、OneDrive)

源码介绍 在数字化时代&#xff0c;我们经常需要存储、分享大量的文件&#xff0c;如照片、视频、文档等。然而&#xff0c;许多商业网盘服务却存在限速、收费等问题&#xff0c;给用户带来诸多不便。现在&#xff0c;我们为您推荐一款免费开源的网盘系统——Cloudreve。 Clo…

【PACS Web系统】全网首发JAVA开发PACS医疗影像工作站

目录 业务分析&#xff1a; 市场前景&#xff1a; Web版相对单机版优势&#xff1a; 主干功能&#xff1a; RBAC用户权限管理、服务监控、字典维护、通知公告等基础模块&#xff1b; 手动上传Dicom文件/文件夹&#xff0c;及接收Dicom服务器的Dicom文件集功能&#xff1b…

Sqoop与其他数据采集工具的比较分析

比较Sqoop与其他数据采集工具是一个重要的话题&#xff0c;因为不同的工具在不同的情况下可能更适合。在本博客文章中&#xff0c;将深入比较Sqoop与其他数据采集工具&#xff0c;提供详细的示例代码和全面的内容&#xff0c;以帮助大家更好地了解它们之间的差异和优劣势。 Sq…