Imitation beating the package and release the card to slide vue npm

image description

Project initialization
using webpack-simple way more convenient and easy to configure, the original way the various pit Shenru

vue init webpack-simple vue-card-slide

cd  vue-card-slide

npm run dev

Project structure shown below

clipboard.png
Configuration changes webpack.config.js

entry: './src/lib/index.js',

output: {

path: path.resolve(__dirname, './dist'),

publicPath: '',

filename: 'vue-card-slide.js',

library: 'VueCardSlide',

libraryTarget: 'umd',

umdNamedDefine: true}

Modify package.json

"name": "vue-card-slide",
"description": "A vue plugin for Carousel Card Slide", 
"version": "1.1.1", 
"author": "carrie ", 
"license": "MIT", 
"private": false, 
"main": "dist/vue-card-slide.js", 
"repository": { 
"type": "git",
 "url": "https://github.com/Carrie999/vue-card-slide/" 
}

Modify index.html
the src = "/ dist / build.js" changed src = "/ dist / vue- card-slide.js"
package insert packed upload their respective addresses git

Registration npm npm login npm publish on the package upload a success

// ES6引入                               

import cardSlide from 'vue-card-slide'   

// require引入

var cardSlide = require('CardSlide')

Vue.use(cardSlide)// 组件中使用

Attach git address poke me

Guess you like

Origin www.cnblogs.com/jlfw/p/11956312.html