将 vuex 存储导入 laravel 页面时出现意外令牌错误答案

【问题标题】：unexpected token error importing a vuex store to laravel page将 vuex 存储导入 laravel 页面时出现意外令牌错误
【发布时间】：2018-03-22 22:22:17
【问题描述】：

对 Vue 来说是新的，对 Vuex 来说是非常新的。我试图将一个商店导入我的主页，我的所有组件都从该主页分支出来，但我在浏览器控制台中不断收到“意外令牌 {”错误。我通读了文档，但找不到任何可以解决此问题的内容。我已经尝试过尽可能地改变每一点语法，但似乎没有什么不同。导入中存储周围的括号似乎是问题所在，但是当我删除它们时，我只会得到一个新的“意外标识符”或“意外字符串”错误。我是否错误地导入它？这种格式适用于我所有的组件，只是不适用于这个新的 vue 实例。

vuex-test.blade.php

@extends('core.core_layouts.core_blank')

@section('browsertitle')
@endsection

@section('top-css')
@endsection

@section('breadcrumb')
@endsection


@section('main')
  <component :is="currentView" v-bind="currentProperties"></component>
@endsection


@section('bottom-js')
<script>

    import { store } from './../stores/store1.js';

    var app = new Vue({
        el:"#app",
        store,
        data: {
        currentView: 'org-list',
        choseOrg: {{ $org }},
    },  // end data
    computed: {
        currentProperties: function() {
            if (this.currentView === 'org-list') { return { } }
            if (this.currentView === 'add-org') { return { parentOrg: '' } }
        }
    },   
    mounted : function() {
    }, // end mounted
    methods: {
    }, // end methods
    components: {
    },
});
</script>
@endsection

store1.js

export const store = new Vuex.Store({
  state: {
    safelyStoredNumber: 'ret',
    count: 2,
  },
  mutations: {
    setOrgIdentity(state, orgID) {
    state.OrgID = orgID
    }
  }
 });

【问题讨论】：

你从哪里得到这个错误？在浏览器上？另外，你能显示store1.js的来源吗？
抱歉，问题没有达到应有的完整程度。我已经用 store1.js 更新了它，找到了它不工作的完整文件。
你从哪里得到错误？在浏览器上？
是的，在浏览器中。
import 不会在那里工作。尝试将import { store } from './../stores/store1.js'; 更改为<script src="./../stores/store1.js"></script>（将路径更改为更合适的路径）并在store1.js 中执行：window.store = new Vuex.Store({。

标签： vuejs2 laravel-5.4 vuex

【解决方案1】：

每厘米：

是的，我在浏览器中收到错误消息。

import 不会在那里工作。它旨在在基于 vue-cli 的项目的构建阶段在 node.js 上运行。

如果您将代码直接部署到浏览器，则需要使用浏览器支持的代码。在这种情况下，导入其他 JavaScript 文件的解决方案是标准的<script> 标签。

所以，在你的代码中，改变：

import { store } from './../stores/store1.js';

类似（将路径更改为更合适的路径）：

<script src="./../stores/store1.js"></script>

在 store1.js 中（因为 export 对 node.js 来说太重要了），替换：

export const store = new Vuex.Store({

与：

window.store = new Vuex.Store({

【讨论】：