Rollup构建发布一个Vue组件

创建项目 本地创建一个目录&执行初始化命令： mkdir vue-component cd vue-component npm init 安装依赖： npm i rollup npm i rollup-plugin-commonjs

</template> <script> export default { name: 'vue-component /vue-component.vue" export default { install(Vue,options){ Vue.component("vue-component"

如何手动解析vue单文件并预览？

const parseVueComponentData2 = (data) => { let htmlStr = `

` // 把vue单文件字符串里的/转成\/是因为如果不转，那么浏览器会错把模板里的标签当成页面的实际标签，会造成页面解析错误 let jsStr = ` new Vue({ el: '#app', components: { 'vue-component templateEl, scriptEl, styleEls } } 接下来解析script块的内容，我们最终是要返回一个选项对象，也就是这样的： { name: 'vue-component options.template = parseTemplate(templateEl) options.name = 'vue-component' return options }