Question

我正在玩vuejs路由器并尝试加载组件。我使用了示例代码并更改了foo

// Define some components
var Foo = Vue.extend({
    template: require('./components/test.vue')
});

var Bar = Vue.extend({
    template: '<p>This is bar!</p>'
});

// The router needs a root component to render.
// For demo purposes, we will just use an empty one
// because we are using the HTML as the app template.
var App = Vue.extend({})

// Create a router instance.
// You can pass in additional options here, but let's
// keep it simple for now.
var router = new VueRouter()

// Define some routes.
// Each route should map to a component. The "component" can
// either be an actual component constructor created via
// Vue.extend(), or just a component options object.
// We'll talk about nested routes later.
router.map({
    '/foo': {
        component: Foo
    },
    '/bar': {
        component: Bar
    }
})

// Now we can start the app!
// The router will create an instance of App and mount to
// the element matching the selector #app.
router.start(App, '#app')

我也用

测试了它

Vue.component('Foo', {
    template: require('./components/test.vue')
})

在test.vue我有

<template>

<h2>Test</h2>

</template>

但是一旦我使用require我就不会在我的开发工具中每次出现错误Required is not defined。

我在这里错了什么？

Answer 1

require是NodeJS环境中内置的，用于Grunt构建环境。

如果您还想在浏览器环境中使用它，可以集成此版本：http://requirejs.org

Answer 2

使用Browserify或Webpack，因为Vue社区中有活跃支持

http://vuejs.org/guide/application.html#Deploying_for_Production（死链接）

我个人使用了Vue GitHub-org的this repo来快速入门。

修改
  这在2018年初有所改变。

部署指南：https://vuejs.org/v2/guide/deployment.html

＆＃39;开始使用＆＃39;类型仓库：https://github.com/vuejs/vue-loader

Vuejs - 要求未定义

2 个答案: