Following this
meteor-webpack
And the error shows up when run meteor
W20200621-11:40:32.093(8)? (STDERR) ERROR in ./src/imports/ui/pages/Auth/VerifyEmail.vue 1:0
W20200621-11:40:32.093(8)? (STDERR) Module parse failed: Unexpected token (1:0)
W20200621-11:40:32.093(8)? (STDERR) You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
W20200621-11:40:32.093(8)? (STDERR) > <template>
W20200621-11:40:32.093(8)? (STDERR) | <div class="container">
W20200621-11:40:32.094(8)? (STDERR) | <div v-if="error" class="alert alert-danger" role="alert">
W20200621-11:40:32.094(8)? (STDERR) @ ./src/imports/routes.js 46:0-57 194:19-30
W20200621-11:40:32.094(8)? (STDERR) @ ./src/imports/app.js
W20200621-11:40:32.094(8)? (STDERR) @ ./src/imports/server.js
W20200621-11:40:32.094(8)? (STDERR) @ ./startup/server/init.js
W20200621-11:40:32.094(8)? (STDERR)
W20200621-11:40:32.095(8)? (STDERR) ERROR in ./src/imports/ui/pages/Auth/Profile.vue 1:0
W20200621-11:40:32.095(8)? (STDERR) Module parse failed: Unexpected token (1:0)
W20200621-11:40:32.095(8)? (STDERR) You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
W20200621-11:40:32.095(8)? (STDERR) > <template>
W20200621-11:40:32.095(8)? (STDERR) | <div v-if="!userVerified" class="container">
All the place are this type of error!
I have double checked and no Upper case of Vue
The VerifyEmail.vue is:
<template>
<div class="container">
<div v-if="error" class="alert alert-danger" role="alert">
<h4 class="alert-heading">{{ error }}</h4>
</div>
<ZoomCenterTransition>
<div v-if='success' class="alert alert-success" role="alert">
<h4 class="alert-heading">Verify Success!</h4>
<p>Redirecting...</p>
</div>
</ZoomCenterTransition>
</div>
</template>
<script>
import {mapActions} from 'vuex'
export default {
data(){
return {
isLoading: true,
success:undefined,
error: undefined,
}
},
async created(){
let token = this.$route.params.token;
console.log('created token',token)
const {error, result} = await this.verifyEmail({token});
console.log('created token',error,result)
if(error){
this.error = error
}else{
this.success = true;
this.$router.replace({name:'overview'})
}
this.isLoading = false
},
methods:{
...mapActions(['verifyEmail'])
}
}
</script>
package.json
"dependencies": {
"@babel/runtime": "^7.4.4",
"babel-core": "^6.26.3",
"babel-loader": "^8.1.0",
"babel-preset-env": "^1.7.0",
"babel-preset-stage-2": "^6.24.1",
"babel-preset-stage-3": "^6.24.1",
"babel-preset-vue": "^2.0.2",
"babel-runtime": "^6.26.0",
"bcrypt": "^3.0.8",
"bluebird": "^3.7.2",
"body-parser": "^1.19.0",
"bootstrap": "^4.4.1",
"bootswatch": "^4.5.0",
"bottleneck": "^2.19.5",
"brotli": "^1.3.2",
"cli-progress": "^3.8.2",
"compression": "^1.7.4",
"cookie-parser": "^1.4.5",
"core-js": "^3.0.1",
"cross-env": "^7.0.2",
"crypto-js": "^4.0.0",
"css-loader": "^3.6.0",
"express": "^4.17.1",
"file-loader": "^6.0.0",
"form-data": "^3.0.0",
"handbrake-js": "^5.0.0",
"hooper": "^0.3.4",
"html-minifier": "^4.0.0",
"html-webpack-plugin": "^4.3.0",
"intersection-observer": "^0.6.0",
"lodash": "^4.17.15",
"lru-cache": "^5.1.1",
"marker-clusterer-plus": "^2.1.4",
"meteor-node-stubs": "^0.4.1",
"moment-timezone": "file:../Replacing node_module files/moment-timezone-develop",
"node-fetch": "^2.6.0",
"node-sass": "^4.14.1",
"postscribe": "^2.0.8",
"prerender-node": "^3.2.5",
"request": "^2.88.2",
"request-promise": "^4.2.5",
"rss-parser": "^3.8.0",
"sass-loader": "^8.0.2",
"segfault-handler": "^1.3.0",
"simpl-schema": "^1.5.7",
"string-score": "^1.0.1",
"torrent-stream": "^1.2.0",
"uuid": "^7.0.2",
"v-lazy-image": "^1.4.0",
"vue": "2.6.11",
"vue-analytics": "^5.22.1",
"vue-disqus": "^3.0.5",
"vue-dragscroll": "^2.1.0",
"vue-js-modal": "^2.0.0-rc.3",
"vue-loader": "^15.9.2",
"vue-meta": "^2.3.3",
"vue-meteor-tracker": "^2.0.0-beta.4",
"vue-observe-visibility": "^0.4.4",
"vue-router": "^3.0.6",
"vue-server-renderer": "2.6.11",
"vue-social-sharing": "^2.4.7",
"vue-style-loader": "^4.1.2",
"vue-template-compiler": "^2.6.11",
"vue-toast-notification": "^0.2.0",
"vue2-transitions": "^0.3.0",
"vuex": "^3.1.1",
"vuex-router-sync": "^5.0.0",
"webpack": "^4.43.0",
"webpack-dev-middleware": "^3.7.2",
"webpack-hot-middleware": "^2.25.0",
"webpack-meteor-externals": "0.0.5",
"webpack-node-externals": "^1.7.2",
"webtorrent": "file:../Replacing node_module files/webtorrent"
},
"devDependencies": {
"@fortawesome/fontawesome-free": "^5.13.0",
"babel-helper-vue-jsx-merge-props": "^2.0.3",
"babel-plugin-syntax-jsx": "^6.18.0",
"babel-plugin-transform-vue-jsx": "^3.7.0"
}
meteor packages:
ostrio:cookies
meteor-base@1.4.0 # Packages every Meteor app needs to have
mobile-experience@1.1.0 # Packages for a great mobile UX
mongo@1.10.0 # The database Meteor supports right now
tracker@1.2.0 # Meteor's client-side reactive programming library
shell-server@0.5.0 # Server-side component of the `meteor shell` command
accounts-password@1.6.0
schema-index
browser-policy@1.1.0
littledata:synced-cron
reywood:publish-composite
underscore@1.0.10
fourseven:scss
cdn
dburles:collection-helpers
natestrauser:publish-performant-counts
force-ssl@1.1.0
accounts-google@1.3.3
accounts-facebook@1.3.2
service-configuration@1.0.11
alanning:roles
fortawesome:fontawesome
routepolicy@1.1.0
ostrio:meteor-root
ardatan:webpack
ardatan:webpack-dev-middleware
server-render@0.3.1
I was using 
akryum:vue-component
And i removed that after add meteor-webpack
webpack config:
var path = require('path')
var webpack = require('webpack')
const HtmlWebpackPlugin = require('html-webpack-plugin');
const meteorExternals = require('webpack-meteor-externals');
const nodeExternals = require('webpack-node-externals');
const clientConfig = {
entry: './startup/client/init.js',
output: {
publicPath: '/',
filename: 'build.js'
},
module: {
rules: [{
test: /\.css$/,
use: [
'vue-style-loader',
'css-loader'
],
},
{
test: /\.scss$/,
use: [
'vue-style-loader',
'css-loader',
'sass-loader'
]
},
{
test: /\.vue$/,
include: /src/,
loader: 'vue-loader',
options: {
loaders: {}
// other vue-loader options go here
}
},
{
test: /\.js$/,
loader: 'babel-loader',
exclude: /node_modules/
},
{
test: /\.(png|jpg|gif|svg)$/,
loader: 'file-loader',
options: {
name: '[name].[ext]?[hash]'
}
}
]
},
resolve: {
alias: {
'vue$': 'vue/dist/vue.esm.js'
},
extensions: ['*', '.js', '.vue', '.json']
},
externals: [meteorExternals()],
devServer: {
historyApiFallback: true,
noInfo: true,
overlay: true,
hot: true
},
performance: {
hints: false
},
devtool: '#eval-source-map',
plugins: [
new webpack.HotModuleReplacementPlugin(),
new HtmlWebpackPlugin({
template: './client/index.html'
})
]
}
const serverConfig = {
entry: './startup/server/init.js',
target: 'node',
externals: [meteorExternals(), nodeExternals()],
devServer: {
hot: true
},
};
module.exports = [clientConfig, serverConfig];
/startup/client/init.js
import { Cookies } from 'meteor/ostrio:cookies';
import '../../src/imports/client'
cookies = new Cookies();
// Chrome 1 - 79
window.isChrome = function() {
return navigator.userAgent.indexOf("Chrome") > -1;
}
client.js
import 'intersection-observer'
import { Meteor } from 'meteor/meteor'
import CreateApp from './app'
import Vue from 'vue'
import './lib/init'
// import { onPageLoad } from "meteor/server-render";
import VueAnalytics from 'vue-analytics'
import VueDisqus from 'vue-disqus'
import { SlideYDownTransition, SlideXRightTransition, SlideYUpTransition, CollapseTransition, ZoomXTransition, ZoomCenterTransition } from 'vue2-transitions'
import VueToast from 'vue-toast-notification';
// Import any of available themes
import 'vue-toast-notification/dist/theme-default.css';
//import 'vue-toast-notification/dist/theme-sugar.css';
import VModal from 'vue-js-modal'
import 'hooper/dist/hooper.css';
// const subsCache = new SubsCache({
// expireAfter: 5,
// cacheLimit: 20
// })
// Vue.prototype.$subsCache = subsCache;
const SocialSharing = require('vue-social-sharing');
Meteor.startup(() => {
// console.log('initalize cookies', cookies)
// setTimeout(() => {
const { app, store, router } = CreateApp({ // Same function as the server
ssr: false,
});
// Hydrate the Vuex store with the JSON string
if (window._VUE_APP_) {
store.replaceState(window._VUE_APP_);
}
app.$mount('#app');
Vue.component('SlideYDownTransition', SlideYDownTransition)
Vue.component('SlideXRightTransition', SlideXRightTransition)
Vue.component('SlideYUpTransition', SlideYUpTransition)
Vue.component('ZoomXTransition', ZoomXTransition)
Vue.component('CollapseTransition', CollapseTransition)
Vue.component('ZoomCenterTransition', ZoomCenterTransition)
Vue.use(VueDisqus)
Vue.use(SocialSharing);
Vue.use(VModal)
Vue.use(VueToast, {
// One of options
position: 'top'
})
})
// onPageLoad(async sink => {
// console.log('onPageLoad')
.babelrc
{
"presets": [
"env",
"vue",
"stage-2"
],
"plugins": [
"transform-vue-jsx"
]
}
.meteorignore
* !.meteor/ !node_modules/ !webpack.config.js
.vueignore
node_modules/