需要来自JS文件的Vue

时间:2017-03-15 11:18:56

标签: javascript npm webpack vue.js web-frontend

我对现代前端开发工具很陌生。 我安装了Nodejs和NPM。下载了一些软件包(es:" jquery"),一切正常。然后我安装了Webpack(第2节),我创建了这个演示配置文件

module.exports = {
   entry: "./entry.js",
   output: {
       path: __dirname,
       filename: "bundle.js"
   }
};

在我的JS入口点(entry.js)中,我可以成功使用jQuery模块,如下所示

var $ = require("jquery");
$('#test').html('Changed!');

一切正常。 当我去Vue时出现问题。我安装它

npm install vue --save

然后使用它

var Vue = require("vue");
var app = new Vue({
    el: '#app',
    data: {
        message: 'Hello Vue!'
    }
});

我不知道如何导入然后使用构造函数。我写的清楚不可能是对的!实际上我得到了这个错误

TypeError: Vue is not a constructor

我错过了什么? (注意:我没有使用任何其他工具,只有Nodejs + NPM + Webpack2,我想继续使用这三个,如果可能的话)。

谢谢你, 马可

1 个答案:

答案 0 :(得分:4)

Vue提供了webpack使用的ES模块。您期望的构造函数是默认导出,但require的工作方式略有不同,因此您需要访问导入的default属性。

var Vue = require('vue').default;

或者您可以使用webpack支持的导入语法。等效导入是:

import Vue from 'vue';
相关问题