vue加载单文件使用vue-loader报错

报错信息如下:ERROR in ./src/login.vue
Module Error (from ./node_modules/vue-loader/lib/index.js):
vue-loader was used without the corresponding plugin. Make sure to include VueLoaderPlugin in your webpack config.
 @ ./src/main.js 7:13-35
解决办法如下:
// webpack.config.js
const VueLoaderPlugin = require(‘vue-loader/lib/plugin‘)
module.exports = {
    plugins:[
        new VueLoaderPlugin()
    ],
    module:{
        rules:[
            {test:/\.vue/,use:‘vue-loader‘},
        ]
    },
}

原文地址:https://www.cnblogs.com/Mishell/p/12266909.html

时间: 2024-11-05 14:50:58

vue加载单文件使用vue-loader报错的相关文章

https网页加载http资源导致的页面报错及解决方案

https是当下的网站的主流趋势,甚至像苹果这样的大公司,则完全要求用户必须使用https地址. 然而对于以前http链接来说,我们往往就存在一个兼容性问题,因为你不可能一下就全部切换过去,应该在很长一段时间内,https与http将共存. https与http共存的场景有如: 1. app已经发布出去,其调用接口的地址为http的,那么这是必须兼容的. 2. app中嵌入了h5页面,而这页面在以前的设计中是使用http访问的,如果换成https地址,极有可能将导致h5页面无法打开. 3. 对于

jquery加载单文件vue组件

/**注册组件 */ function registerComponent(name){ dm[name] = {}; Vue.component(name + '-component', function(resolve, reject){ $.get('./modules/' + name + '.vue').then(function(rv){ var temp = rv.match(/<template[^>]*>([\s\S]*?)<\/template>/)[1]

webpack模块加载css文件及图片地址

webpack支持css文件加载并打包,只需安装相应加载器并在配置文件中配置 . 加载的css文件内容会与该模块里的js内容混合封装,这样做的好处是一个js文件包含了所有的css与js内容,有效减少了http请求次数,显著提高了页面响应性能的用户体验. 加载css文件时,如果css里含有图片的引用地址,编译时webpack会将图片资源处理并输出到设置的publicPath参数位置,该参数可以是以页面为基准的相对地址,也可以是以根目录为基准的绝对地址.url-laoder会在这个地址下兴建一个im

Oracle Bigdata Connector实战1: 使用Oracle Loader加载HDFS文件到Oracle数据库

部署jdk/Hadoop/OraLoader软件包 将准备好的软件包,逐一解压到hadoop用户home目录下: hadoop-2.6.2.tar.gz jdk-8u65-linux-x64.gz oraloader-3.4.0.x86_64.zip Hadoop软件部署如下: ├── hadoop-2.6.2 ├── jdk1.8.0_65 ├── oraloader-3.4.0-h2 设置环境变量 export JAVA_HOME=/home/hadoop/jdk1.8.0_65 expor

在sublime 编辑器中,安装插件 Vue Syntax Hightlight,高亮识别Vue.js 的单文件组件(*.vue)

转自:http://www.cnblogs.com/cosnyang/p/6290950.html 默认情况下,Vue.js 的单文件组件(*.vue)在 sublime 编辑器中是不被识别的.若要想高亮显示,需要安装插件 Vue Syntax Hightlight.安装步骤如下: 第一,在 sublime 中打开 PackageControl 如下图,快捷键 Ctrl+Shift+P. 第二,打开 Install Package 窗口.下图中第一个,回车. 打开过程中,右下角出现状态栏.如下图

用AngularJS构建单页应用,根据需求加载JS文件的方法

我们在AngularJS中可以根据网址不同直接切换view,动态加载网页模板,但是控制模板的控制器需要先定义好才可以,不能和网页模板同时加载,这样就造成整个网站的JS都要先加载完成. requireJS是大家第一个想到的东西,但是体积有点大,github上就有个人用它写了Angular的动态加载controller模块,是通过js promise异步编程技术实现的,最后的解决很简单~~ 首先在$routeProvider里面加resolve属性, $routeProvider. when('/p

Android运行时ART加载OAT文件的过程分析

在前面一文中,我们介绍了Android运行时ART,它的核心是OAT文件.OAT文件是一种Android私有ELF文件格式,它不仅包含有从DEX文件翻译而来的本地机器指令,还包含有原来的DEX文件内容.这使得我们无需重新编译原有的APK就可以让它正常地在ART里面运行,也就是我们不需要改变原来的APK编程接口.本文我们通过OAT文件的加载过程分析OAT文件的结构,为后面分析ART的工作原理打基础. 老罗的新浪微博:http://weibo.com/shengyangluo,欢迎关注! OAT文件

JVM加载class文件的原理

当Java编译器编译好.class文件之后,我们需要使用JVM来运行这个class文件.那么最开始的工作就是要把字节码从磁盘输入到内存中,这个过程我们叫做[加载 ].加载完成之后,我们就可以进行一系列的运行前准备工作了,比如: 为类静态变量开辟空间,将常量池存放在方法区内存中并实现常量池地址解析,初始化类静态变量等等.这篇文章我们要好好谈谈JVM是如何加载class文件的? 1.JVM加载类的过程       当我们使用命令来执行某一个Java程序(比如Test.class)的时候:java T

webpack2 热加载js 文件

如果只要普通的热加载 只要如下配置就好了 package.json { "devDependencies": { "webpack": "^2.6.1", "webpack-dev-server": "^2.4.5" }, "scripts": { "start": "webpack-dev-server" } } webpack.config.j