ibn-tag-new
v2.0.2
Published
A Vue.js project
Downloads
1
Readme
ibn-tag
Install
1.npm安装 npm install ibn-tag-new
2.yarn安装 yarn add ibn-tag-new
3.引用ibn-tag-new.js
使用方法：
1.组件内部使用 html:
js：
import IbnTagNew from 'ibn-tag-new'
components: {
IbnTagNew
}
2. main.js 全局安装：
import IbnTagNew from 'ibn-tag-new'
Vue.use(IbnTagNew)
然后在其他.vue文件里面，直接使用组件 <IbnTagNew>标签一</IbnTagNew> 即可
3.直接引用打包后的 ibn-tag-new.js
这种方式就不需要webpack这类的构建工具，跟jquery的方式差不多，可以直接页面引用，使用方法示例如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
</head>
<body>
<div id="app">
<ibn-tag-new>标签1</ibn-tag-new>
</div>
<script src="https://unpkg.com/vue/dist/vue.js"></script>
<script src="./dist/ibn-tag-new.js"></script>
<script>
new Vue({
el: '#app'
})
</script>
</body>
</html>A Vue.js project
Build Setup
# install dependencies
npm install
# serve with hot reload at localhost:8080
npm run dev
# build for production with minification
npm run buildwebpack.config.js 小组件打包配置
module.exports = { entry: './src/lib/index.js', output: { path: path.resolve(__dirname, './dist'), publicPath: '/dist/', filename: 'ibn-tag.js', library: 'IbnTag', // library指定的就是你使用require时的模块名，这里便是require("IbnTag") libraryTarget: 'umd', //libraryTarget会生成不同umd的代码,可以只是commonjs标准的，也可以是指amd标准的，也可以只是通过script标签引入的。 umdNamedDefine: true // 会对 UMD 的构建过程中的 AMD 模块进行命名。否则就使用匿名的 define } ...... }
引入组件
if (typeof window !== 'undefined' && window.Vue) { window.Vue.use(paykeyboard); }
package.json 发布npm配置
"private": false, // private是true的时候不能发布到npm,需设置成false "main": "./dist/ibn-tag.js", "repository": { "type": "git", "url": "https://github.com/yucccc/ibn-tag" }
For detailed explanation on how things work, consult the docs for vue-loader.