import Vue from 'vue'; import Vuex from 'vuex'; import App from './App'; const icons = [ 'square', 'circle', 'rectangle-vertical', 'rectangle-horizontal' ]; Vue.use(Vuex); const store = new Vuex.Store({ state: { icons } }); new Vue({ el: '#app', store, components: {App}, template: '<app/>' }); // Vue.component('icon', { // props: { // name: { // type: String, // required: true // }, // size: { // type: String, // default: '24' // } // }, // template: '#icon-template', // mounted() { // fetch(`./icons/${this.name}.svg`) // .then(response => { // if (response.ok) { // return response.text(); // } // throw new Error(`Cannot find ${this.name}.svg`); // }) // .then(svgText => { // const svgDocument = new DOMParser().parseFromString(svgText, 'image/svg+xml'); // const svgIcon = svgDocument.querySelector('svg').cloneNode(true); // svgIcon.setAttribute('width', this.size); // svgIcon.setAttribute('height', this.size); // this.$el.appendChild(svgIcon); // }) // .catch(error => { // console.error(error); // }); // } // }); // Vue.component('icon-container', { // props: { // name: { // type: String, // required: true // } // }, // template: '#icon-container-template' // })