快来把自己的代码放到npm上吧~

简介: 按照惯例,介绍一下 vue-admin-work 框架,非常感谢大家的支持和鼓励。我们会继续努力完善,为广大前端小伙伴提供更好的服务。

前言

按照惯例,介绍一下 vue-admin-work 框架,非常感谢大家的支持和鼓励。我们会继续努力完善,为广大前端小伙伴提供更好的服务。

演示地址:http://qingqingxuan.gitee.io/vue-admin-work/

什么是npm

看一下官方介绍:

NPM是随同NodeJS一起安装的包管理工具,能解决NodeJS代码部署上的很多问题,常见的使用场景有以下几种:

  • 允许用户从NPM服务器下载别人编写的第三方包到本地使用。
  • 允许用户从NPM服务器下载并安装别人编写的命令行程序到本地使用。
  • 允许用户将自己编写的包或命令行程序上传到NPM服务器供别人使用。

当我们在电脑上安装完node之后,npm服务就安装完成了。这里不多介绍概念性的东西了,总之就是一个组织,上面有好多别人写好的代码供我们使用,当然,我们也可以把自己的代码放上去供别人使用。如果对这个还不了解,建议您先去网上查一下资料再来阅读下面的内容哦~~~


准备工作

如果我们想要把自己的代码放在npm,供别人下载使用,首先得先有源码啊。在开发 vue-admin-work的时候 ,在登录页面中有一个滑动验证组件,为了方便后期的项目使用,我就把它抽取成一个项目,开发完之后就放到了npm上了。以后我们在别的项目使用的时候就直接可以直接

npm install vaw-verify --save

就好了。是不是很方便的,大大提高了重用性和维护性。

另外,如果想要在npm发布源码,还得需要在npm上注册一个账号,这个没啥好说的,就和github一样。官网链接如下:

npm: https://www.npmjs.com/

打开如下:

4edc953e2c684bbe819ffa954c899c08.png

点击 sign up按钮一步步注册账号就好。


发布

这里假定您已经有一个项目要发布到 npm上,用 vscode打开项目(本人比较喜欢这个开发工具,其它开发工具也可以的哦)。打开底部终端:

4edc953e2c684bbe819ffa954c899c08.png

输入如下命令:

npm login

// 输入完以上命令,会让你输入你注册时用的 UsernamePassword,和 Email。如实填写就好。填写好所有信息,回车就好。登录成功会有如下提示:Logged in as xxxxx on https://registry.npmjs.org/.

4edc953e2c684bbe819ffa954c899c08.png

到这里就说明登录成功,可以进行发布了。

然后再在终端里输入

npm publish

等他发布完就ok啦~


添加忽略文件

.gitignore 一样,我们在发布的时候,不想把所有的文件都发布,有些文件是不需要发布的,这个时候就需要在项目的根目录下面创建一个文件:.npmignore

打开添加要忽略的文件就行了。我的文件内容如下:

.DS_Store
node_modules
/dist
/public
/src
/lib/*.map
babel.config.js
.gitignore
README.md
package-lock.json
# local env files
.env.local
.env.*.local
# Log files
npm-debug.log*
yarn-debug.log*
yarn-error.log*
pnpm-debug.log*
# Editor directories and files
.idea
.vscode
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?

文件内容,根据个人的情况而定。


完成

到这里就完成了对项目的发布,当我们使用命令:

npm install xxxx

添加依赖的时候,项目就会从 npm 上下载下来放进项目的 node_modules目录中哦。

相关文章
|
6月前
|
JavaScript 编译器
Babel对ES6模块化代码转换、ES6模块化引入NPM包
Babel对ES6模块化代码转换、ES6模块化引入NPM包
47 0
|
11月前
|
JavaScript 前端开发 开发工具
前端工程化的Node.js之代码的组织/部署的包管理器 npm
在前端开发中,代码的组织和部署是非常重要的一环。为了提高开发效率和代码质量,我们需要使用工程化的方式来管理和组织代码。其中一个非常重要的前端工具就是 Node.js,而在 Node.js 中最为关键的工具之一就是包管理器 npm。
103 0
|
JSON JavaScript 前端开发
如何在npm发布可安装的代码
npm发布依赖简单教程
153 0
|
JavaScript 前端开发 开发工具
开源必备,手把手教你做自己的开源项目--如何把代码放到npm上让别人下载
开源必备,手把手教你做自己的开源项目--如何把代码放到npm上让别人下载
开源必备,手把手教你做自己的开源项目--如何把代码放到npm上让别人下载
|
4天前
|
网络安全 计算机视觉
【node】 npm install 报错:code 128
【node】 npm install 报错:code 128
41 1
|
4天前
|
JavaScript Linux 数据安全/隐私保护
node内网安装npm私服以及依赖包上传发布verdaccio
node内网安装npm私服以及依赖包上传发布verdaccio
110 1
|
4天前
|
JavaScript 内存技术
node与npm版本对应关系以及使用nvm管理node版本
node与npm版本对应关系以及使用nvm管理node版本
506 0
|
4天前
|
JavaScript
npm install没问题,但npm run dev的时候报Node Sass version 6.0.1 is incompatible with ^4.0.0 ^5.0.0
npm install没问题,但npm run dev的时候报Node Sass version 6.0.1 is incompatible with ^4.0.0 ^5.0.0

推荐镜像

更多