Webpack Vue路由器。未能装入组件

Webpack Vue路由器。未能装入组件,webpack,vuejs2,vue-component,vue-router,Webpack,Vuejs2,Vue Component,Vue Router,我正在使用Vue cli网页包模板(),在我尝试使用Vue路由器之前,我的项目中一切正常。然后它开始发送此错误: ([Vue warn]:未能装入组件:未定义模板或呈现函数。(位于src\components\emptance\emptance.Vue中) 我尝试了Stackoverflow的大部分答案,但都没用。我现在很沮丧,因为我不知道如何保持发展。下面是我的项目的相关文件: main.js import Vue from 'vue' import App from './App' impo

我正在使用Vue cli网页包模板(),在我尝试使用Vue路由器之前,我的项目中一切正常。然后它开始发送此错误:
([Vue warn]:未能装入组件:未定义模板或呈现函数。(位于src\components\emptance\emptance.Vue中)

我尝试了Stackoverflow的大部分答案,但都没用。我现在很沮丧,因为我不知道如何保持发展。下面是我的项目的相关文件:

main.js

import Vue from 'vue'
import App from './App'
import router from './router'
import VueAwesomeSwiper from 'vue-awesome-swiper'


Vue.config.productionTip = false

new Vue({
  el: '#app',
  router,
  template: '<App/>',
  components: { App }
})
import Vue from 'vue'
import Router from 'vue-router'
import Main from '@/components/main/Main'
import Vacancy from '@/components/vacancy/Vacancy'

Vue.use(Router)

export default new Router({
    mode: 'history',
    routes: [
    {
        path: '/',
        name: 'Main',
        component: Main
    },
    {
        path: '/vacancy',
        name: 'Vacancy',
        component: Vacancy
    },
    { path: '*', redirect: '/' }
    ]
})
var path = require('path')
var utils = require('./utils')
var config = require('../config')
var vueLoaderConfig = require('./vue-loader.conf')

function resolve (dir) {
  return path.join(__dirname, '..', dir)
}

module.exports = {
  entry: {
    app: './src/main.js'
  },
  output: {
    path: config.build.assetsRoot,
    filename: '[name].js',
    publicPath: process.env.NODE_ENV === 'production'
      ? config.build.assetsPublicPath
      : config.dev.assetsPublicPath
  },
  resolve: {
    extensions: ['.js', '.vue', '.json'],
    alias: {
      'vue$': 'vue/dist/vue.esm.js',
      '@': resolve('src'),
      'src': path.resolve(__dirname, '../src'),
      'assets': path.resolve(__dirname, '../src/assets'),
      'components': path.resolve(__dirname, '../src/components'),
      'modules': path.resolve(__dirname, '../node_modules')
    }
  },
  module: {
    rules: [
      {
        test: /\.vue$/,
        loader: 'vue-loader',
        options: vueLoaderConfig
      }, 
      {
          test: /\.s[a|c]ss$/,
          loader: 'style!css!sass'
      },
      {
        test: /\.js$/,
        loader: 'babel-loader',
        include: [resolve('src'), resolve('test')]
      },
      {
        test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
        loader: 'url-loader',
        query: {
          limit: 10000,
          name: utils.assetsPath('img/[name].[hash:7].[ext]')
        }
      },
      {
        test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
        loader: 'url-loader',
        query: {
          limit: 10000,
          name: utils.assetsPath('fonts/[name].[hash:7].[ext]')
        }
      }
    ]
  }
}
package.json

    {
  "name": "sinc",
  "version": "1.0.0",
  "description": "VueJS-app with Bitrix integration",
  "author": "Eldar",
  "private": true,
  "scripts": {
    "dev": "node build/dev-server.js",
    "build": "node build/build.js"
  },
  "dependencies": {
    "css-loader": "^0.27.3",
    "jquery": "^3.2.1",
    "vue": "^2.2.2",
    "vue-awesome-swiper": "^2.3.8",
    "vue-router": "^2.2.0",
    "vue-style-loader": "^2.0.4"
  },
  "devDependencies": {
    "autoprefixer": "^6.7.2",
    "babel-core": "^6.22.1",
    "babel-loader": "^6.2.10",
    "babel-plugin-transform-runtime": "^6.22.0",
    "babel-preset-env": "^1.2.1",
    "babel-preset-stage-2": "^6.22.0",
    "babel-register": "^6.22.0",
    "chalk": "^1.1.3",
    "connect-history-api-fallback": "^1.3.0",
    "copy-webpack-plugin": "^4.0.1",
    "eventsource-polyfill": "^0.9.6",
    "express": "^4.14.1",
    "extract-text-webpack-plugin": "^2.0.0",
    "file-loader": "^0.10.0",
    "friendly-errors-webpack-plugin": "^1.1.3",
    "function-bind": "^1.1.0",
    "html-webpack-plugin": "^2.28.0",
    "http-proxy-middleware": "^0.17.3",
    "node-sass": "^4.5.1",
    "opn": "^4.0.2",
    "optimize-css-assets-webpack-plugin": "^1.3.0",
    "ora": "^1.1.0",
    "rimraf": "^2.6.0",
    "sass-loader": "^6.0.3",
    "semver": "^5.3.0",
    "style-loader": "^0.16.0",
    "url-loader": "^0.5.7",
    "vue-html-loader": "^1.2.4",
    "vue-loader": "^11.1.4",
    "vue-style-loader": "^2.0.0",
    "vue-template-compiler": "^2.2.4",
    "webpack": "^2.2.1",
    "webpack-bundle-analyzer": "^2.2.1",
    "webpack-dev-middleware": "^1.10.0",
    "webpack-hot-middleware": "^2.16.1",
    "webpack-merge": "^2.6.1"
  },
  "engines": {
    "node": ">= 4.0.0",
    "npm": ">= 3.0.0"
  },
  "browserslist": [
    "> 1%",
    "last 2 versions",
    "not ie <= 8"
  ]
}

编辑:原来是在“空缺”成分中关闭“模板”标记时出错。

编辑:原来是在“空缺”成分中关闭“模板”标记时出错。

事实上我没有。因为我在安装vue cli模板时选择的是Runtime+compiler(不仅仅是Runtime,它使用的是“render”),它不能像这样使用它。我还试着像你说的那样更改渲染,然后使用所有可能的选项更改webpack.base.conf.js中的别名,比如“'vue$”:'vue/dist/vue.esm.js'”里面是什么/components/expancy/expancy?只是一个带有一些文本的空模板*.vue,没有什么特别之处。一些漂亮的东西

p{color:#000;}哦,哇,这是打字错误,谢谢你的帮助,伙计。伙计们,如果你遇到同样的问题,请检查你的代码的类型错误@如果这回答了你的问题,你应该接受答案。事实上我没有。因为我在安装vue cli模板时选择的是Runtime+compiler(不仅仅是Runtime,它使用的是“render”),它不能像这样使用它。我还试着像你说的那样更改渲染,然后使用所有可能的选项更改webpack.base.conf.js中的别名,比如“'vue$”:'vue/dist/vue.esm.js'”里面是什么/components/expancy/expancy?只是一个带有一些文本的空模板*.vue,没有什么特别之处。一些漂亮的东西

p{color:#000;}哦,哇,这是打字错误,谢谢你的帮助,伙计。伙计们,如果你遇到同样的问题,请检查你的代码的类型错误@如果这回答了您的问题,您应该接受答案。