{"version":3,"sources":["webpack:///webpack/bootstrap","webpack:///./src/App.vue?0220","webpack:///./src/App.vue","webpack:///./src/views/About.vue?2169","webpack:///src/views/About.vue","webpack:///./src/views/About.vue?4206","webpack:///./src/views/About.vue","webpack:///./src/router/index.js","webpack:///./src/main.js","webpack:///./src/App.vue?f446","webpack:///./src/views/About.vue?72f4"],"names":["webpackJsonpCallback","data","moduleId","chunkId","chunkIds","moreModules","executeModules","i","resolves","length","Object","prototype","hasOwnProperty","call","installedChunks","push","modules","parentJsonpFunction","shift","deferredModules","apply","checkDeferredModules","result","deferredModule","fulfilled","j","depId","splice","__webpack_require__","s","installedModules","exports","module","l","m","c","d","name","getter","o","defineProperty","enumerable","get","r","Symbol","toStringTag","value","t","mode","__esModule","ns","create","key","bind","n","object","property","p","jsonpArray","window","oldJsonpFunction","slice","_vm","this","_h","$createElement","_c","_self","attrs","staticRenderFns","script","component","staticClass","src","previewURL","ref","_m","beforeAvatarUpload","model","ruleForm","callback","$$v","$set","expression","slot","_v","btnChangeEnable","on","$event","toCart","components","VueDragResize","coverUrl","coverFile","img1000","uplod","styleIndex","BoxLeft","BoxTop","top","parentW","left","value1","height","getWidth","canvasHeight","dragwidth","onoff","Grayscaleoff","ele","interval","methods","getparentW","file","imagePreview","self","reader","FileReader","onload","e","target","initCanvas","readAsDataURL","getW","canvas","$refs","ctx","getContext","width","fillStyle","fillRect","img","Image","drawImage","toDataURL","updata","location","href","size","parseInt","$axios","Vue","use","VueRouter","routes","path","redirect","About","router","base","process","axios","config","productionTip","render","h","App","$mount"],"mappings":"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","file":"js/app.fcd4db41.js","sourcesContent":[" \t// install a JSONP callback for chunk loading\n \tfunction webpackJsonpCallback(data) {\n \t\tvar chunkIds = data[0];\n \t\tvar moreModules = data[1];\n \t\tvar executeModules = data[2];\n\n \t\t// add \"moreModules\" to the modules object,\n \t\t// then flag all \"chunkIds\" as loaded and fire callback\n \t\tvar moduleId, chunkId, i = 0, resolves = [];\n \t\tfor(;i < chunkIds.length; i++) {\n \t\t\tchunkId = chunkIds[i];\n \t\t\tif(Object.prototype.hasOwnProperty.call(installedChunks, chunkId) && installedChunks[chunkId]) {\n \t\t\t\tresolves.push(installedChunks[chunkId][0]);\n \t\t\t}\n \t\t\tinstalledChunks[chunkId] = 0;\n \t\t}\n \t\tfor(moduleId in moreModules) {\n \t\t\tif(Object.prototype.hasOwnProperty.call(moreModules, moduleId)) {\n \t\t\t\tmodules[moduleId] = moreModules[moduleId];\n \t\t\t}\n \t\t}\n \t\tif(parentJsonpFunction) parentJsonpFunction(data);\n\n \t\twhile(resolves.length) {\n \t\t\tresolves.shift()();\n \t\t}\n\n \t\t// add entry modules from loaded chunk to deferred list\n \t\tdeferredModules.push.apply(deferredModules, executeModules || []);\n\n \t\t// run deferred modules when all chunks ready\n \t\treturn checkDeferredModules();\n \t};\n \tfunction checkDeferredModules() {\n \t\tvar result;\n \t\tfor(var i = 0; i < deferredModules.length; i++) {\n \t\t\tvar deferredModule = deferredModules[i];\n \t\t\tvar fulfilled = true;\n \t\t\tfor(var j = 1; j < deferredModule.length; j++) {\n \t\t\t\tvar depId = deferredModule[j];\n \t\t\t\tif(installedChunks[depId] !== 0) fulfilled = false;\n \t\t\t}\n \t\t\tif(fulfilled) {\n \t\t\t\tdeferredModules.splice(i--, 1);\n \t\t\t\tresult = __webpack_require__(__webpack_require__.s = deferredModule[0]);\n \t\t\t}\n \t\t}\n\n \t\treturn result;\n \t}\n\n \t// The module cache\n \tvar installedModules = {};\n\n \t// object to store loaded and loading chunks\n \t// undefined = chunk not loaded, null = chunk preloaded/prefetched\n \t// Promise = chunk loading, 0 = chunk loaded\n \tvar installedChunks = {\n \t\t\"app\": 0\n \t};\n\n \tvar deferredModules = [];\n\n \t// The require function\n \tfunction __webpack_require__(moduleId) {\n\n \t\t// Check if module is in cache\n \t\tif(installedModules[moduleId]) {\n \t\t\treturn installedModules[moduleId].exports;\n \t\t}\n \t\t// Create a new module (and put it into the cache)\n \t\tvar module = installedModules[moduleId] = {\n \t\t\ti: moduleId,\n \t\t\tl: false,\n \t\t\texports: {}\n \t\t};\n\n \t\t// Execute the module function\n \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n \t\t// Flag the module as loaded\n \t\tmodule.l = true;\n\n \t\t// Return the exports of the module\n \t\treturn module.exports;\n \t}\n\n\n \t// expose the modules object (__webpack_modules__)\n \t__webpack_require__.m = modules;\n\n \t// expose the module cache\n \t__webpack_require__.c = installedModules;\n\n \t// define getter function for harmony exports\n \t__webpack_require__.d = function(exports, name, getter) {\n \t\tif(!__webpack_require__.o(exports, name)) {\n \t\t\tObject.defineProperty(exports, name, { enumerable: true, get: getter });\n \t\t}\n \t};\n\n \t// define __esModule on exports\n \t__webpack_require__.r = function(exports) {\n \t\tif(typeof Symbol !== 'undefined' && Symbol.toStringTag) {\n \t\t\tObject.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });\n \t\t}\n \t\tObject.defineProperty(exports, '__esModule', { value: true });\n \t};\n\n \t// create a fake namespace object\n \t// mode & 1: value is a module id, require it\n \t// mode & 2: merge all properties of value into the ns\n \t// mode & 4: return value when already ns object\n \t// mode & 8|1: behave like require\n \t__webpack_require__.t = function(value, mode) {\n \t\tif(mode & 1) value = __webpack_require__(value);\n \t\tif(mode & 8) return value;\n \t\tif((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;\n \t\tvar ns = Object.create(null);\n \t\t__webpack_require__.r(ns);\n \t\tObject.defineProperty(ns, 'default', { enumerable: true, value: value });\n \t\tif(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));\n \t\treturn ns;\n \t};\n\n \t// getDefaultExport function for compatibility with non-harmony modules\n \t__webpack_require__.n = function(module) {\n \t\tvar getter = module && module.__esModule ?\n \t\t\tfunction getDefault() { return module['default']; } :\n \t\t\tfunction getModuleExports() { return module; };\n \t\t__webpack_require__.d(getter, 'a', getter);\n \t\treturn getter;\n \t};\n\n \t// Object.prototype.hasOwnProperty.call\n \t__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };\n\n \t// __webpack_public_path__\n \t__webpack_require__.p = \"/\";\n\n \tvar jsonpArray = window[\"webpackJsonp\"] = window[\"webpackJsonp\"] || [];\n \tvar oldJsonpFunction = jsonpArray.push.bind(jsonpArray);\n \tjsonpArray.push = webpackJsonpCallback;\n \tjsonpArray = jsonpArray.slice();\n \tfor(var i = 0; i < jsonpArray.length; i++) webpackJsonpCallback(jsonpArray[i]);\n \tvar parentJsonpFunction = oldJsonpFunction;\n\n\n \t// add entry module to deferred list\n \tdeferredModules.push([0,\"chunk-vendors\"]);\n \t// run deferred modules when ready\n \treturn checkDeferredModules();\n","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{attrs:{\"id\":\"app\"}},[_c('router-view')],1)}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","import { render, staticRenderFns } from \"./App.vue?vue&type=template&id=01c7a4e8&\"\nvar script = {}\nimport style0 from \"./App.vue?vue&type=style&index=0&lang=scss&\"\n\n\n/* normalize component */\nimport normalizer from \"!../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"about\"},[_c('div',{staticClass:\"right\"},[_c('div',{staticClass:\"resImg\"},[_c('img',{attrs:{\"src\":_vm.src.previewURL,\"alt\":\"\"}})]),_c('canvas',{ref:\"canvas\"}),_c('div',{staticClass:\"rignt-btn\"},[_c('div',{staticClass:\"button-step\"},[_vm._m(0),_c('el-upload',{staticClass:\"avatar-uploader\",attrs:{\"action\":\"\",\"show-file-list\":false,\"before-upload\":_vm.beforeAvatarUpload},model:{value:(_vm.ruleForm.coverFile),callback:function ($$v) {_vm.$set(_vm.ruleForm, \"coverFile\", $$v)},expression:\"ruleForm.coverFile\"}},[_c('el-button',{attrs:{\"slot\":\"trigger\",\"size\":\"small\",\"type\":\"primary\"},slot:\"trigger\"},[_vm._v(\"upload image\")])],1)],1),_vm._m(1),_c('el-button',{attrs:{\"size\":\"small\",\"disabled\":_vm.btnChangeEnable,\"type\":\"primary\"},on:{\"click\":function($event){return _vm.toCart()}}},[_vm._v(\"Add To Cart \")])],1)])])}\nvar staticRenderFns = [function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"btn-text\"},[_c('p',[_vm._v(\"Upload your picture and\")]),_c('p',[_vm._v(\"turn it to a dotidoole\")]),_c('p',[_vm._v(\"puzzle package\")])])},function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"btn-text\"},[_c('p',[_vm._v(\"Let our artist design it for you\")])])}]\n\nexport { render, staticRenderFns }","<template>\n  <div class=\"about\">\n    <div class=\"right\">\n      <div class=\"resImg\">\n        <img :src=\"src.previewURL\" alt=\"\" />\n      </div>\n      <canvas ref=\"canvas\"></canvas>\n      <div class=\"rignt-btn\">\n        <div class=\"button-step\">\n          <div class=\"btn-text\">\n            <p>Upload your picture and</p>\n            <p>turn it to a dotidoole</p>\n            <p>puzzle package</p>\n          </div>\n          <el-upload\n            class=\"avatar-uploader\"\n            action=\"\"\n            :show-file-list=\"false\"\n            :before-upload=\"beforeAvatarUpload\"\n            v-model=\"ruleForm.coverFile\"\n          >\n            <el-button slot=\"trigger\" size=\"small\" type=\"primary\"\n              >upload image</el-button\n            >\n          </el-upload>\n        </div>\n        <div class=\"btn-text\">\n          <p>Let our artist design it for you</p>\n        </div>\n        <el-button\n          size=\"small\"\n          :disabled=\"btnChangeEnable\"\n          @click=\"toCart()\"\n          type=\"primary\"\n          >Add To Cart\n        </el-button>\n      </div>\n    </div>\n  </div>\n</template>\n<script>\nimport VueDragResize from \"vue-drag-resize\";\nexport default {\n  name: \"About\",\n  components: {\n    VueDragResize,\n  },\n  data() {\n    return {\n      ruleForm: {\n        coverUrl: \"\",\n        coverFile: \"\",\n      },\n      img1000: \"\",\n      uplod: false,\n      styleIndex: 0,\n      BoxLeft: 0,\n      BoxTop: 0,\n      top: 0,\n      parentW: 0,\n      left: 0,\n      value1: 0,\n      height: \"200\",\n      getWidth: 0,\n      canvasHeight: \"200\",\n      dragwidth: 16.22222,\n      btnChangeEnable: true,\n      src: {},\n      onoff: true,\n      Grayscaleoff: false,\n      ele: null,\n      interval: null,\n    };\n  },\n  methods: {\n    getparentW() {\n      this.parentW =\n        33.33333 * parseFloat(document.documentElement.style.fontSize);\n    },\n    beforeAvatarUpload(file) {\n      this.getWidth =\n        this.dragwidth * parseFloat(document.documentElement.style.fontSize);\n      this.ruleForm.coverFile = file;\n      this.imagePreview(this.ruleForm.coverFile);\n      return false;\n    },\n    imagePreview: function (file) {\n      var self = this;\n      //定义一个文件阅读器\n      var reader = new FileReader();\n      //文件装载后将其显示在图片预览里\n      reader.onload = function (e) {\n        //将bade64位图片保存至数组里供上面图片显示\n        self.ruleForm.coverUrl = e.target.result;\n        self.initCanvas();\n      };\n      reader.readAsDataURL(file);\n    },\n    getW() {\n      this.getWidth =\n        this.dragwidth * parseFloat(document.documentElement.style.fontSize);\n    },\n    initCanvas() {\n      var canvas = this.$refs.canvas;\n      var ctx = canvas.getContext(\"2d\");\n      canvas.width = 1000;\n      canvas.height = 1000;\n      ctx.fillStyle = \"#fff\";\n      ctx.fillRect(0, 0, canvas.width, canvas.height);\n      var self = this;\n      var img = new Image();\n      img.src = self.ruleForm.coverUrl;\n      img.onload = function () {\n        var s = img.height / img.width;\n        if (s > 1) {\n          ctx.drawImage(img, 0, 0, (1000 / img.height) * img.width, 1000);\n        } else if (s < 1) {\n          ctx.drawImage(img, 0, 0, 1000, (1000 / img.width) * img.height);\n        } else {\n          ctx.drawImage(img, 0, 0, 1000, 1000);\n        }\n        // self.updata(canvas)\n        self.img1000 = canvas.toDataURL(\"image/jpeg\");\n        self.updata();\n      };\n    },\n\n    toCart() {\n      window.location.href = `http://mskpt.com/cart/?add-to-cart=149&quantity=3&mproject_url=<img src=\"${this.src.thumbURL}\"/>&mproject_info=${this.src.projectID}`;\n    },\n    updata: function () {\n      if (!this.img1000) {\n        return;\n      }\n      this.uplod = true;\n      var img = this.img1000;\n      var size = parseInt(img.length);\n      let xm = `<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n                        <SOAP-ENV:Envelope\n                            xmlns:SOAP-ENV=\"http://schemas.xmlsoap.org/soap/envelope/\"\n                            xmlns:xsd=\"http://www.w3.org/2001/XMLSchema\"\n                            xmlns:xsi=\"http://www.w3.org/2001/XMLSchema-instance\"\n                            xmlns:SOAP-ENC=\"http://schemas.xmlsoap.org/soap/encoding/\">\n                            <SOAP-ENV:Body\n                                xmlns:NS1=\"urn:ezm_renderIntf-Iezm_render\"\n                                SOAP-ENV:encodingStyle=\"http://schemas.xmlsoap.org/soap/encoding/\">\n                                <NS1:MRJpgUpload_HY2>\n                                    <size xsi:type=\"xsd:int\">\n                                        ${size}\n                                    </size>\n                                    <jpg xsi:type=\"xsd:base64Binary\">${img}</jpg></NS1:MRJpgUpload_HY2>\n                            </SOAP-ENV:Body>\n                        </SOAP-ENV:Envelope>`;\n      this.$axios\n        .post(\n          \"https://dotidoodle.com/render2/dotimap.dll/soap/Idotim_render\",\n          xm\n        )\n        .then((response) => {\n          this.uplod = false;\n          var parser = new DOMParser();\n          var xmlDoc = parser.parseFromString(response.data, \"text/xml\");\n          //获取DOM节点的标签为 dzLoginResult 的第一个节点对象\n          var MDotResponse = xmlDoc.getElementsByTagName(\"NS2:TMRmsg\")[0]\n            .childNodes;\n          MDotResponse.forEach((item) => {\n            this.src[item.nodeName] = item.innerHTML;\n          });\n          // xmlDoc.getElementsByTagName('msg')[0];\n          if (this.src.msg == \"Good Request\") {\n            this.btnChangeEnable = false;\n          }\n        })\n        .catch((error) => {\n          self.uplod = false;\n        });\n    },\n  },\n};\n</script>\n<style lang=\"scss\">\n.vdr.active:before {\n  content: \"\";\n  outline: 4px dashed #d6d6d6 !important;\n}\n.el-radio__inner {\n  width: 24px;\n  height: 24px;\n}\n.el-radio__inner::after {\n  width: 8px;\n  height: 8px;\n}\n.el-radio__label {\n  font-size: 18px;\n}\n.el-button {\n  width: 256px;\n  height: 60px;\n  font-size: 30px;\n  border-radius: 30px;\n}\n.s-list-tit {\n  margin-bottom: 20px;\n}\n.box1 {\n  width: 40%;\n}\n.list-top {\n  margin-top: 40px;\n}\n.button-step {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  flex-wrap: wrap;\n  margin-top: 7rem;\n  .button-step-text {\n    width: 100%;\n    display: flex;\n    justify-content: flex-start;\n    font-size: 30px;\n    align-items: center;\n  }\n  .btn {\n    width: 150px;\n    height: 150px;\n    border-radius: 50%;\n    margin-right: 15px;\n    font-size: 100px;\n    text-align: center;\n    line-height: 150px;\n    font-weight: 600;\n    color: white;\n  }\n  .btn1 {\n    background: #d382af;\n    margin-bottom: 50px;\n  }\n  .btn2 {\n    background: #ab1b40;\n  }\n  .btn3 {\n    margin-right: 0;\n    margin-bottom: 50px;\n    background: #662f8e;\n  }\n}\n.about {\n  border-radius: 20px;\n  canvas {\n    position: absolute;\n    left: -10000px;\n  }\n  .right {\n    padding: 30px 40px;\n    display: flex;\n    flex-wrap: wrap;\n    justify-content: space-between;\n    margin: 20px auto;\n    background: #000;\n    .resImg {\n      margin-bottom: 10px;\n      width: 500px;\n      height: 500px;\n      background: white;\n      img {\n        width: 100%;\n      }\n    }\n    .rignt-btn {\n      width: 300px;\n      display: flex;\n      flex-direction: column;\n      align-items: center;\n      .button-step {\n        margin-bottom: 20px;\n      }\n      .btn-text {\n        color: white;\n        font-size: 24px;\n        text-align: center;\n        p {\n          margin: 0;\n          &.text-top {\n            margin: 20px 0 10px;\n          }\n        }\n      }\n    }\n  }\n}\n</style>","import mod from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./About.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./About.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./About.vue?vue&type=template&id=2dc969bf&\"\nimport script from \"./About.vue?vue&type=script&lang=js&\"\nexport * from \"./About.vue?vue&type=script&lang=js&\"\nimport style0 from \"./About.vue?vue&type=style&index=0&lang=scss&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports","import Vue from 'vue'\nimport VueRouter from 'vue-router'\nimport About from '../views/About.vue'\n\nVue.use(VueRouter)\n\nconst routes = [\n  { path: '/', redirect: '/RenderEngine'},\n  {\n    path: '/RenderEngine',\n    name: 'About',\n    component: About,\n  }\n]\n\nconst router = new VueRouter({\n  base: process.env.BASE_URL,\n  routes\n})\n\nexport default router\n","import Vue from 'vue'\r\nimport App from './App.vue'\r\nimport router from './router'\r\nimport axios from 'axios'\r\nVue.prototype.$axios = axios \r\nimport { Button, Upload, Slider, Switch, Radio  } from 'element-ui';\r\nimport 'lib-flexible'\r\n\r\nVue.use(Upload)\r\nVue.use(Slider)\r\nVue.use(Switch)\r\nVue.use(Button)\r\nVue.use(Radio)\r\n\r\nVue.config.productionTip = false\r\n\r\nnew Vue({\r\n  router,\r\n  render: h => h(App)\r\n}).$mount('#app')\r\n","import mod from \"-!../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../node_modules/css-loader/dist/cjs.js??ref--8-oneOf-1-1!../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../node_modules/sass-loader/dist/cjs.js??ref--8-oneOf-1-3!../node_modules/cache-loader/dist/cjs.js??ref--0-0!../node_modules/vue-loader/lib/index.js??vue-loader-options!./App.vue?vue&type=style&index=0&lang=scss&\"; export default mod; export * from \"-!../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../node_modules/css-loader/dist/cjs.js??ref--8-oneOf-1-1!../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../node_modules/sass-loader/dist/cjs.js??ref--8-oneOf-1-3!../node_modules/cache-loader/dist/cjs.js??ref--0-0!../node_modules/vue-loader/lib/index.js??vue-loader-options!./App.vue?vue&type=style&index=0&lang=scss&\"","import mod from \"-!../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../node_modules/css-loader/dist/cjs.js??ref--8-oneOf-1-1!../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../node_modules/sass-loader/dist/cjs.js??ref--8-oneOf-1-3!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./About.vue?vue&type=style&index=0&lang=scss&\"; export default mod; export * from \"-!../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../node_modules/css-loader/dist/cjs.js??ref--8-oneOf-1-1!../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../node_modules/sass-loader/dist/cjs.js??ref--8-oneOf-1-3!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./About.vue?vue&type=style&index=0&lang=scss&\""],"sourceRoot":""}