Giter VIP home page Giter VIP logo

Comments (10)

zwwill avatar zwwill commented on July 29, 2024

@b2nil 感谢反馈,已修复 #17
需要指定版本号

from megalo.

b2nil avatar b2nil commented on July 29, 2024

@zwwill 试了一下,Vuex 可以挂载了。赞!

但是使用 vuex 时遇到了两个问题:

  1. 在 app 层面注册全局 store, page 中无法通过 this.$store 获取到全局 store,this.$store 获取到的是 undefined。 不知道这是不是因为的方法不对。单独页面注册局部 store,只要不用问题 2 中的语法,都没问题。
  2. 使用 mapState, mapGetters, mapActions 会出现语法错误,...mapState({ //... }) 会报错。错误代码如下:
ERROR in ./src/pages/home/Home.vue?vue&type=script&lang=js& (./node_modules/babel-loader/lib!./node_modules/@megalo/target/lib/loaders/script.js!./node_modules/vue-loader/lib??vue-loader-options!./src/pages/home/Home.vue?vue&type=script&lang=js&)
Module build failed (from ./node_modules/@megalo/target/lib/loaders/script.js):
**SyntaxError: unknown: Unexpected token (46:4)
  44 |     //   return this.$store.state.testStr
  45 |     // }
> 46 |     ...mapState({
     |     ^
  47 |       stateStr: state => state.testStr
  48 |     })
  49 |   },**
    at Parser.pp$5.raise (E:\vueprojects\mgl-demo\node_modules\babel-core\node_modules\babylon\lib\index.js:4454:13)
    at Parser.pp.unexpected (E:\vueprojects\mgl-demo\node_modules\babel-core\node_modules\babylon\lib\index.js:1761:8)
    at Parser.pp$3.parseIdentifier (E:\vueprojects\mgl-demo\node_modules\babel-core\node_modules\babylon\lib\index.js:4332:10)
    at Parser.pp$3.parsePropertyName (E:\vueprojects\mgl-demo\node_modules\babel-core\node_modules\babylon\lib\index.js:4156:96)
    at Parser.pp$3.parseObj (E:\vueprojects\mgl-demo\node_modules\babel-core\node_modules\babylon\lib\index.js:4045:12)
    at Parser.pp$3.parseExprAtom (E:\vueprojects\mgl-demo\node_modules\babel-core\node_modules\babylon\lib\index.js:3719:19)
    at Parser.pp$3.parseExprSubscripts (E:\vueprojects\mgl-demo\node_modules\babel-core\node_modules\babylon\lib\index.js:3494:19)
    at Parser.pp$3.parseMaybeUnary (E:\vueprojects\mgl-demo\node_modules\babel-core\node_modules\babylon\lib\index.js:3474:19)
    at Parser.pp$3.parseExprOps (E:\vueprojects\mgl-demo\node_modules\babel-core\node_modules\babylon\lib\index.js:3404:19)
    at Parser.pp$3.parseMaybeConditional (E:\vueprojects\mgl-demo\node_modules\babel-core\node_modules\babylon\lib\index.js:3381:19)
    at Parser.pp$3.parseMaybeAssign (E:\vueprojects\mgl-demo\node_modules\babel-core\node_modules\babylon\lib\index.js:3344:19)
    at Parser.pp$3.parseObjectProperty (E:\vueprojects\mgl-demo\node_modules\babel-core\node_modules\babylon\lib\index.js:4115:99)
    at Parser.pp$3.parseObjPropValue (E:\vueprojects\mgl-demo\node_modules\babel-core\node_modules\babylon\lib\index.js:4140:84)
    at Parser.pp$3.parseObj (E:\vueprojects\mgl-demo\node_modules\babel-core\node_modules\babylon\lib\index.js:4048:10)
    at Parser.pp$3.parseExprAtom (E:\vueprojects\mgl-demo\node_modules\babel-core\node_modules\babylon\lib\index.js:3719:19)
    at Parser.pp$3.parseExprSubscripts (E:\vueprojects\mgl-demo\node_modules\babel-core\node_modules\babylon\lib\index.js:3494:19)
    at Parser.pp$3.parseMaybeUnary (E:\vueprojects\mgl-demo\node_modules\babel-core\node_modules\babylon\lib\index.js:3474:19)
    at Parser.pp$3.parseExprOps (E:\vueprojects\mgl-demo\node_modules\babel-core\node_modules\babylon\lib\index.js:3404:19)
    at Parser.pp$3.parseMaybeConditional (E:\vueprojects\mgl-demo\node_modules\babel-core\node_modules\babylon\lib\index.js:3381:19)
    at Parser.pp$3.parseMaybeAssign (E:\vueprojects\mgl-demo\node_modules\babel-core\node_modules\babylon\lib\index.js:3344:19)
    at Parser.pp$1.parseExport (E:\vueprojects\mgl-demo\node_modules\babel-core\node_modules\babylon\lib\index.js:2645:19)
    at Parser.pp$1.parseStatement (E:\vueprojects\mgl-demo\node_modules\babel-core\node_modules\babylon\lib\index.js:1884:74)
    at Parser.pp$1.parseBlockBody (E:\vueprojects\mgl-demo\node_modules\babel-core\node_modules\babylon\lib\index.js:2268:21)
    at Parser.pp$1.parseTopLevel (E:\vueprojects\mgl-demo\node_modules\babel-core\node_modules\babylon\lib\index.js:1778:8)
    at Parser.parse (E:\vueprojects\mgl-demo\node_modules\babel-core\node_modules\babylon\lib\index.js:1673:17)
    at parse (E:\vueprojects\mgl-demo\node_modules\babel-core\node_modules\babylon\lib\index.js:7305:37)
    at File.parse (E:\vueprojects\mgl-demo\node_modules\babel-core\lib\transformation\file\index.js:485:15)
    at File.parseCode (E:\vueprojects\mgl-demo\node_modules\babel-core\lib\transformation\file\index.js:570:20)
    at E:\vueprojects\mgl-demo\node_modules\babel-core\lib\transformation\pipeline.js:49:12
    at File.wrap (E:\vueprojects\mgl-demo\node_modules\babel-core\lib\transformation\file\index.js:532:16)
    at Pipeline.transform (E:\vueprojects\mgl-demo\node_modules\babel-core\lib\transformation\pipeline.js:47:17)
    at Object.module.exports (E:\vueprojects\mgl-demo\node_modules\@megalo\target\lib\loaders\script.js:12:21)

from megalo.

zwwill avatar zwwill commented on July 29, 2024

@b2nil
我写了个 vuex 的 example 并没有发现你说的这个问题,https://github.com/kaola-fed/megalo-demo

from megalo.

zwwill avatar zwwill commented on July 29, 2024

@b2nil ... 扩展符需要你自己配一下 .babelrc 文件

from megalo.

b2nil avatar b2nil commented on July 29, 2024

@zwwill
谢谢,我的 babel 插件配置错了,导致使用扩展符时报错。

可否给一个多个 page 实例共用一个全局 store 的 demo?

参考了一些mpvue的写法,都不成功,比较头大。

from megalo.

F-loat avatar F-loat commented on July 29, 2024

@b2nil 每个 vue 实例化时都传入同一个 store 不行吗

from megalo.

b2nil avatar b2nil commented on July 29, 2024

@F-loat,每个Vue实例都传入同一个store,我测试的时候并不能更改全局的状态。一个页面更改状态后,另一个页面的状态不会更新。我现在不方便贴代码,不知道是不是我的逻辑有误。

from megalo.

zwwill avatar zwwill commented on July 29, 2024

@b2nil @F-loat 就目前来看,store 挂在 app.js 下是不好使的,这个问题我们会排查下,后面会跟大家反馈结果的

from megalo.

elcarim5efil avatar elcarim5efil commented on July 29, 2024

问题原因是 webpack 打包的时候存在多个runtime,因此 Vue 没有共享一个模块,修改一下配置项,加上 optimization.runtimeChunk 的配置。

    optimization: {
      runtimeChunk: {
        name: 'runtime'
      }
    },

runtime chunk

脚手架和 demo 也会作出相应更新,谢谢反馈。

@b2nil @F-loat

from megalo.

b2nil avatar b2nil commented on July 29, 2024

加上 optimization.runtimeChunk 配置后,vuex 使用正常。
多谢!
@elcarim5efil

from megalo.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.