廢文集中區

Vue Plugin: vue-runkit

發表於
分類於 專案
中文版

This article is automatically translated by LLM, so the translation may be inaccurate or incomplete. If you find any mistake, please let me know.
You can find the original article here .

vue-runkit is a Vue component, a wrapper for runkit

Runkit is a website that allows you to run some Node.js programs in the browser

GitHub: https://github.com/maple3142/vue-runkit

Installation

Install: npm install vue-runkit CDN: https://unpkg.com/vue-runkit

Code

<!--建議手動引用"https://embed.runkit.com"，不過就算沒有的話vue-runkit也會自動加入-->
<script src="https://embed.runkit.com"></script>
<script src="https://unpkg.com/vue/dist/vue.min.js"></script>
<script src="https://unpkg.com/vue-runkit/dist/vue-runkit.min.js"></script>
<div id="runkit">
	<!--加button是為了只在需要時才載入embed-->
	<button v-if="!show" @click="show=!show">show embed</button>
	<runkit v-else :source="code" :env="env" node-version="8"/>
</div>
Vue.component('runkit', vuerunkit) //註冊 component
new Vue({
	el: '#runkit',
	data: {
		show: false,
		code: 'console.log(process.env.msg)', //code
		env: ['msg="Hello World"'] //環境變數
	}
})