Skip to content

Instantly share code, notes, and snippets.

@vuejsdevelopers
vuejsdevelopers / index.html
Created Feb 6, 2019
New in Vue: ES Module Browser Build - Snippet 11
View index.html
<script type="module" src="vue.mjs"></script>
<script type="module" src="app.js"></script>
<script nomodule src="/dist/build.js"></script> <!--Fallback-->
@vuejsdevelopers
vuejsdevelopers / webpack.config.js
Created Feb 6, 2019
New in Vue: ES Module Browser Build - Snippet 10
View webpack.config.js
module.exports = {
entry: './app.js',
output: {
path: path.resolve(__dirname, './dist'),
publicPath: '/dist/',
filename: 'build.js'
},
module: {
// add Babel here if needed
},
@vuejsdevelopers
vuejsdevelopers / app.js
Created Feb 6, 2019
New in Vue: ES Module Browser Build - Snippet 09
View app.js
import Vue from './vue.mjs';
new Vue({
el: '#app',
data: {
message: 'Hello Vue 2.6.0-beta1 ESM Browser Build!'
}
});
@vuejsdevelopers
vuejsdevelopers / index.js
Created Feb 6, 2019
New in Vue: ES Module Browser Build - Snippet 08
View index.js
<!DOCTYPE html>
<html>
<head>
<title>Vue.js ESM</title>
</head>
<body>
<div id="app">
{{ message }}
</div>
</body>
@vuejsdevelopers
vuejsdevelopers / index.html
Created Feb 6, 2019
New in Vue: ES Module Browser Build - Snippet 07
View index.html
<script type="module" src="vue.esm.js"></script>
@vuejsdevelopers
vuejsdevelopers / index.html
Created Feb 6, 2019
New in Vue: ES Module Browser Build - Snippet 06
View index.html
<script type="text/javascript" src="/dist/bundle.js"></script>
@vuejsdevelopers
vuejsdevelopers / app.js
Created Feb 6, 2019
New in Vue: ES Module Browser Build - Snippet 05
View app.js
import Vue from "vue";
new Vue();
@vuejsdevelopers
vuejsdevelopers / index.html
Created Feb 6, 2019
New in Vue: ES Module Browser Build - Snippet 04
View index.html
<script type="text/javascript" src="https://mycdn.com/vue.js"></script>
<script type="text/javascript">
new Vue();
</script>
@vuejsdevelopers
vuejsdevelopers / utils.mjs
Last active Feb 6, 2019
New in Vue: ES Module Browser Build - Snippet 03
View utils.mjs
export function addTextToBody(text) {
const div = document.createElement('div');
div.textContent = text;
document.body.appendChild(div);
}
@vuejsdevelopers
vuejsdevelopers / index.html
Last active Feb 6, 2019
New in Vue: ES Module Browser Build - Snippet 02
View index.html
<script type="module">
import {addTextToBody} from './utils.mjs';
addTextToBody('Modules are pretty cool.');
</script>
You can’t perform that action at this time.