I know with vue-cli importing components is really simple. However, would it be possible to import components to a vue project that is not using vue-cli?
For example my index.html would look like:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Vue components</title>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/vue.js"> </script>
<script src="https://github.com/mdbootstrap/Vue-Bootstrap-with-Material-Design/archive/mdbvue.js"> </script>
</head>
<body>
<div id="vue-app">
<Btn color="danger">Test Button</Btn>
</div>
</body>
</html>
And my app.js:
import { Btn } from 'mdbvue'
new Vue({
el: '#vue-app',
components: {
Btn
},
data: {
}
}
If it would not be as simple as my example is there a tutorial somewhere to figure out how to get this working without using npm or yarn?
Thanks
It might be bit late however I believe in better late than never!!
I came across the simillar situation where I do not want to use any build tool as I feel those build tools are bit of overkill.
There is a js plugin you could give it a go. (I have not used it though as we moved to AngularJS + TypeScript + Visual Studio 2017 - which met our requirement).
Plugin: http-vue-loader
Link : https://github.com/FranckFreiburger/http-vue-loader
Example : on codepen dot io /cscolabear/project/editor/AQLQLO
Requirements
How it works
Notes
The aim of http-vue-loader is to quickly test .vue components without any compilation step. However, for production, I recommend to use webpack module bundler with vue-loader, webpack-simple is a good minimalist webpack config you should look at. BTW, see also why Vue.js doesn't support templateURL.
Caveat
Due to the lack of suitable API in Google Chrome and Internet Explorer, syntax errors in the section are only reported on FireFox.
Credits : Franck Freiburger
import { Btn } from 'mdbvue'
From the codes u posted, u already have used es6 modules. So at least you should use webpack with babel-loader, otherwise, the browser will not support the grammar above.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With