前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >npm发布包以及更新包还有需要注意的几点问题(这里以发布vue插件为例)

npm发布包以及更新包还有需要注意的几点问题(这里以发布vue插件为例)

作者头像
马克社区
发布2022-06-23 10:22:31
4920
发布2022-06-23 10:22:31
举报
文章被收录于专栏:高端IT高端IT

前言

在此之前,你需要去npm官网注册一个属于自己的账号,记住自己的账户名以及密码、邮箱,后面会用的到。 第一步,安装webpack简易框架

vue init webpack-simple marquee

代码语言:text
复制
这里会用到vue init 命令,如果你的cli版本是3或者以上,那么在此之前你需要安装vue/cli-init

npm install -g @vue/cli-init

vue init 的运行效果将会跟 vue-cli@2.x 相同

第二步,封装Vue插件 1、安装完成后,会出现以下目录即可成功

marquee/ ├── index.html ├── package.json ├── README.md ├── .babelrc ├── .editorconfig ├── .gitignore ├── src │ ├── App.vue │ ├── assets │ │ └── logo.png │ └── main.js └── webpack.config.js

2、接下来,我们在src文件夹下创建一个名叫marquee的文件夹,在文件夹里面创建marquee.vue和index.js

marquee/ ├── index.html ├── package.json ├── README.md ├── .babelrc ├── .editorconfig ├── .gitignore ├── src │ ├── App.vue │ ├── marquee │ │ └── marquee.vue │ │ └── index.js │ ├── assets │ │ └── logo.png │ └── main.js └── webpack.config.js

3、开始在marquee.vue封装Vue插件了

代码语言:javascript
复制
<template>
  <div class="marquee-wrap">
    <!-- 滚动内容 -->
    <div class="scroll">
      <p class="marquee">{{text}}</p>
      <!-- 文字副本 -->
      <p class="copy"></p>
    </div>
    <!-- 为了计算总文本宽度,通过css在页面中隐藏 -->
    <p class="getWidth">{{text}}</p>
  </div>
</template>

更多内容请见原文,原文转载自:https://blog.csdn.net/weixin_44519496/article/details/119924268

本文系转载,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文系转载前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档