Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Meteor tool 1.8.3, cannot run basic example from meteor manual #385

Closed
richard-fairthorne opened this issue Dec 20, 2019 · 4 comments
Closed

Meteor tool 1.8.3, cannot run basic example from meteor manual #385

richard-fairthorne opened this issue Dec 20, 2019 · 4 comments

Comments

@richard-fairthorne
Copy link

richard-fairthorne commented Dec 20, 2019 •
edited
Loading

Running the basic example from the meteor 1.8 manual ( https://guide.meteor.com/vue.html#integrating-vue-with-meteor ) results in an error.

Safari:
Screen Shot 2019-12-20 at 10 40 05 AM

Chrome:
Screen Shot 2019-12-20 at 11 28 16 AM

A new directory was created and the example was followed to the letter. (by cut and paste)

I get the same result starting with a default meteor project, and a bare meteor project.

client/main.js

import Vue from 'vue';
import App from './App.vue';
import './main.html';

Meteor.startup(() => {
  new Vue({
    el: '#app',
    ...App,
  });
});

client/main.html:

<body>
  <div id="app"></div>
</body>

client/App.vue

<template>
  <div>
    <p>This is a Vue component and below is the current date:<br />{{date}}</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      date: new Date(),
    };
  }
}
</script>

<style scoped>
  p {
    font-size: 2em;
    text-align: center;
  }
</style>

package.json

{
  "name": "124-debug",
  "private": true,
  "scripts": {
    "start": "meteor run",
    "test": "meteor test --once --driver-package meteortesting:mocha",
    "test-app": "TEST_WATCH=1 meteor test --full-app --driver-package meteortesting:mocha",
    "visualize": "meteor --production --extra-packages bundle-visualizer"
  },
  "dependencies": {
    "@babel/runtime": "^7.7.6",
    "jquery": "^3.4.1",
    "meteor-node-stubs": "^1.0.0",
    "vue": "2.6.11"
  },
  "meteor": {
    "mainModule": {
      "client": "client/main.js",
      "server": "server/main.js"
    },
    "testModule": "tests/main.js"
  }
}

.meteor/packages

# Meteor packages used by this project, one per line.
# Check this file (and the other files in this directory) into your repository.
#
# 'meteor add' and 'meteor remove' will edit this file for you,
# but you can also edit it by hand.

meteor-base@1.4.0             # Packages every Meteor app needs to have
mobile-experience@1.0.5       # Packages for a great mobile UX
mongo@1.7.0                   # The database Meteor supports right now
blaze-html-templates    # Compile .html files into Meteor Blaze views
jquery                  # Wrapper package for npm-installed jquery
reactive-var@1.0.11            # Reactive variable for tracker
tracker@1.2.0                 # Meteor's client-side reactive programming library

standard-minifier-css@1.5.4   # CSS minifier run for production mode
standard-minifier-js@2.5.2    # JS minifier run for production mode
es5-shim@4.8.0                # ECMAScript 5 compatibility for older browsers
ecmascript@0.13.2              # Enable ECMAScript2015+ syntax in app code
typescript@3.7.1              # Enable TypeScript syntax in .ts and .tsx modules
shell-server@0.4.0            # Server-side component of the `meteor shell` command

autopublish@1.0.7             # Publish all data to the clients (for prototyping)
insecure@1.0.7                # Allow all DB writes from clients (for prototyping)
akryum:vue-component

Meteor package versions:

akryum:vue-component@0.15.1
akryum:vue-component-dev-client@0.4.7
akryum:vue-component-dev-server@0.1.4
allow-deny@1.1.0
autopublish@1.0.7
autoupdate@1.6.0
babel-compiler@7.4.2
babel-runtime@1.4.0
base64@1.0.12
binary-heap@1.0.11
blaze@2.3.4
blaze-html-templates@1.1.2
blaze-tools@1.0.10
boilerplate-generator@1.6.0
caching-compiler@1.2.1
caching-html-compiler@1.1.3
callback-hook@1.2.0
check@1.3.1
ddp@1.4.0
ddp-client@2.3.3
ddp-common@1.4.0
ddp-server@2.3.0
deps@1.0.12
diff-sequence@1.1.1
dynamic-import@0.5.1
ecmascript@0.13.2
ecmascript-runtime@0.7.0
ecmascript-runtime-client@0.9.0
ecmascript-runtime-server@0.8.0
ejson@1.1.1
es5-shim@4.8.0
fetch@0.1.1
geojson-utils@1.0.10
hot-code-push@1.0.4
html-tools@1.0.11
htmljs@1.0.11
id-map@1.1.0
insecure@1.0.7
inter-process-messaging@0.1.0
jquery@3.0.0
launch-screen@1.1.1
livedata@1.0.18
logging@1.1.20
meteor@1.9.3
meteor-base@1.4.0
minifier-css@1.4.3
minifier-js@2.5.1
minimongo@1.4.5
mobile-experience@1.0.5
mobile-status-bar@1.0.14
modern-browsers@0.1.4
modules@0.14.0
modules-runtime@0.11.0
mongo@1.7.0
mongo-decimal@0.1.1
mongo-dev-server@1.1.0
mongo-id@1.0.7
npm-mongo@3.2.0
observe-sequence@1.0.16
ordered-dict@1.1.0
promise@0.11.2
random@1.1.0
reactive-var@1.0.11
reload@1.3.0
retry@1.1.0
routepolicy@1.1.0
shell-server@0.4.0
socket-stream-client@0.2.2
spacebars@1.0.15
spacebars-compiler@1.1.3
standard-minifier-css@1.5.4
standard-minifier-js@2.5.2
templating@1.3.2
templating-compiler@1.3.3
templating-runtime@1.3.2
templating-tools@1.1.2
tracker@1.2.0
typescript@3.7.1
ui@1.0.13
underscore@1.0.10
webapp@1.7.5
webapp-hashing@1.0.9

software versions:
Screen Shot 2019-12-20 at 11 31 05 AM

I am eager for a solve. Please let me know anything I can try or do to help isolate the issue.
@richard-fairthorne
Copy link
Author

It may be worthy of note that projects created with previous versions of meteor seem to work fine, even after being upgraded to 1.8.3.

@richard-fairthorne
Copy link
Author

I have created a repository containing the non-working code: https://github.com/richard-fairthorne/bugproof-meteor-vue-component-1

@richard-fairthorne richard-fairthorne mentioned this issue Dec 20, 2019
Closed
@mullojo
Copy link

mullojo commented Dec 20, 2019

Hi @richard-fairthorne , this issue showed up with the 1.8.2+ releases. If you want to follow the Vue tutorial for now, you'll need to use meteor 1.8.1, I have a large app built with Meteor + Vue and 1.8.2 caused a new issue. The issue has been identified here, but the fix has not been released yet: #380

@Akryum
Copy link
Collaborator

Akryum commented Dec 28, 2019

This should be fixed in the new version of vue-component

@Akryum Akryum closed this as completed Dec 28, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
3 participants
@richard-fairthorne @Akryum @mullojo