基于某视频剪辑软件如何发布一个新公共管理包的方法步骤

时间：2021-08-24 来源：互联网编辑：宝哥软件园浏览：次

前言：工作的时候总是使用别人的新公共管理包，然而我有时心底会好奇自己如何发布一个新公共管理包呢，什么时候自己的包能够被很多人喜欢并使用呢.今天我终于迈出了第一步。

前提：会使用国家预防机制，有某视频剪辑软件基础，了解一点工具

你准备好了吗？走吧。

一、编写自己的新公共管理包

1.新建一个空文件夹

2.进入文件夹，终端(cmd)运行新公共管理初始化

完成后会在目录下生成一个package.json文件

我们可以根据自己的需要补充文件内容

这是我的：

{ '名称： 'bing-test-publish-npm '，'版本' : '1.0.0 ','描述' : '布一个新公共管理包、“main”:“index . js”、“scripts”: {“test”:“echo”错误：未指定测试退出1 '，'开始' : ' web pack-dev-server-hot-inline '，'构建' : ' web pack-display-error-details-config web pack。配置。js ' }，'作者' : ' bing '，'许可证' : 'ISC '，'开发依赖' : '配置完后，命令行运行新公共管理安装安装依赖包，安装完会生成一个节点_模块目录

4.接下来新建两个文件夹src(开发目录)，dist(发布目录)

5.然后我们就可以在科学研究委员会目录下编写自己的组件吧

我的文件目录

app.vue

模板差异类='helloName '输入类型=“文本”占位符='请输入姓名v-model=' your name '/input div v-if=' name ' hello pan class=' name ' { name } }！/span/div /div/templatescript导出默认值{ name: ' helloName，data () { return { yourName: '' }，methods: { }，created(){ }/script style/style index。射流研究…

从""导入你好./app。vue ' export默认hellonamewebpack。戴夫。糖膏剂射流研究…

const path=require(' path ')；const web pack=require(' web pack ')；const uglify=require(' uglifyjs-web pack-plugin ')；模块。exports={ devtool : ' source-map '，entry: ' ./src/index.js '，//入口文件科学研究委员会目录下的index.js文件，输出： { path : path。解析(_ dirname，' ./dist ')，//输出路径，就是新建的距离目录，publicPath: '/dist/'，filename: 'helloName.min.js '，libraryTarget: ' umd '，umdNamedDefine: true }，模块： {规则s 3360 [{ test :/\ .vue$/，loader: 'vue-loader' }，test: /\ .减$/,使用：[{ loader : ' style-loader ' }，{ loader: 'css-loader' }，{ loader: 'less-loader' } ] }，{ test: /\ .js$/，排除：/node _ modules | vue \/dist | vue-router \/| vue-loader \/| vue-hot-reload-API \/，loader: 'babel-loader' }，test: /\ .(png | jpg | gif | TTF | SVG | woff | eot)$/，loader: 'url-loader '，query: { limit: 30000，name: '[name].[ext]？[hash]' } } ] }，plugins: [新网络包.definepreplugin({ ' process。env ' : { NODE _ ENV: JSON。stringify(' production ')} })]}文件写好后，我们运行新公共管理运行构建，结果是会在距离目录下生成一个helloName.min.js，就是我们在webpack.dev.conf.js中文件名的值

6.将package.json中的主字段指向新生成的helloName.min.js

7.创建新的。npmignore文件(npmignore file)，它可以忽略不需要发布的文件。如果只有。gitignore，但不是NPMIGNORE。将使用gitignore。

例如：* *.MD *。yml build/node _ modules/src/test/gulf file . js II。发布npm包

1.在https://www.npmjs.com注册账户

2.输入项目根目录并运行npm登录

将输入您的用户名、密码和电子邮件地址

3.登录成功后，执行npm发布，发布成功，我们可以在官网看到

第三，使用你自己的npm包

接下来，我们在其他项目中使用新发布的npm包

1.我们进入我们的项目目录运行npm(或cnpm)安装-测试-发布-NPM(我们刚刚发布的包)

2.在需要使用这个包的页面上介绍它，并使用它

模板div我的npm包helloname/hello name/div/模板脚本导入hello name从' bing-test-publish-NPM '导出默认{name :' NPM '，Data(){ return } }，components 3360 { hello name } }/脚本这时，我发现我的控制台报告了一个错误，原来是编码错误，所以我们需要修改更新代码

模板div class=' helloname '输入类型=' text '占位符='请输入一个名称' v-model=' your name '/输入div v v-if=' your name ' hello span class=' name ' { your name } }！/span/div/div/模板脚本导出默认{ name: ' helloname，data () {return {yourname3360''}，methods: {}，created(){ }/script style/style IV。更新npm包

1.修改代码后，我们需要修改package.json的版本

规则：对于“版本”:“x . y . z”

1.修复bug，进行微小的更改，并添加z。

2.添加了新功能，但它仍然可以向后兼容，添加了y。

3.变化很大，不能向后兼容，加了X

2.修改后运行NPM运行构建，NPM发布成功更新包版本

3.使用时需要

卸载之前安装的软件包NPM卸载-测试-发布-NPM重新安装NPM安装-测试-发布-NPM，通过NPM listing-test-publish-NPM可以看到这个版本是最新的版本。