Question

对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
    }
  }
 });

Answer 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({

意外令牌错误将vuex商店导入laravel页面

1 个答案: