在不用VueCli创建项目的时候,手写引入vue的时候,配置webpack的时候发现了这个问题

webpack vue-loader was used without the corresponding plugin. Make sure to include VueLoaderPlugin

这是因为在15.x.x版本之后,如果要使用vue-loader,需要在webpack种使用vue-loader自带的插件

VueLoaderPlugin

const path = require('path') // node内置模块
const HtmlWebpackPlugin = require('html-webpack-plugin')
const VueLoaderPlugin = require('vue-loader/lib/plugin')
const config = {
mode: 'none',
entry: './src/main',
output: {
filename: 'bundle.js',
},
module: {
rules: [
//....
{
test: /\.vue$/,
use: ['vue-loader']
}
],
},
plugins: [
new HtmlWebpackPlugin({
title: 'Webpack Plugin Sample',
template: './src/index.html'
}),
new VueLoaderPlugin()
]
}
module.exports = config

Vue Vue-loader / VueLoaderPlugin / Webpack的更多相关文章

  1. Vue.js——60分钟webpack项目模板快速入门

    概述 browserify是一个 CommonJS风格的模块管理和打包工具,上一篇我们简单地介绍了Vue.js官方基于browserify构筑的一套开发模板.webpack提供了和browserify ...

  2. Vue.js——60分钟webpack项目模板快速入门

    概述 browserify是一个 CommonJS风格的模块管理和打包工具,上一篇我们简单地介绍了Vue.js官方基于browserify构筑的一套开发模板.webpack提供了和browserify ...

  3. vue 项目中 自定义 webpack 的 配置文件(webpack.config.babel.js)

    webpack.config.babel.js,这样命名是想让webpack在编译的时候自动识别es6的语法,现在貌似不需要这样命名了,之前用webpack1.x的时候貌似是需要的 let path ...

  4. (转)webpack从零开始第6课:在Vue开发中使用webpack

    vue官方已经写好一个vue-webpack模板vue_cli,原本自己写一个,发现官方写得已经够好了,自己写显得有点多余,但为了让大家熟悉webpack,决定还是一步一步从0开始写,但源文件就直接拷 ...

  5. VUE 多页面打包webpack配置

      思路:多配置一个main的文件,用于webpack入口使用, 然后路由的导向也应该默认指向新组件,最后通过webpack构建出一个新的独立的html文件. 缺点:生成多个html会new出多个vu ...

  6. Vue ES6 Jade Scss Webpack Gulp

    一直以来非常庆幸曾经有翻过<代码大全2>:这使我崎岖编程之路少了很多不必要的坎坷.它在软件工艺的话题中有写到一篇:"首先是为人写程序,其次才是机器(Write Programs ...

  7. 创建一个vue项目,vue-cli,webpack

    ,换成淘宝源: npm config set registry https://registry.npm.taobao.org/ 检查是否修改成功 npm config get registry ,安 ...

  8. vue cli 3 & webpack-merge & webpack 3 & bug

    vue cli 3 & webpack-merge & webpack & bug bug webpack-merge & bug webpack-merge ??? ...

  9. Vue+ElementUI项目使用webpack输出MPA

    目录 Vue+ElementUI项目使用webpack输出MPA 一. 需求分析 二. 原方案分析 三. 多页面改造3步走 四. 小结 Vue+ElementUI项目使用webpack输出MPA 示例 ...

  10. Vue+ElementUI项目使用webpack输出MPA【华为云分享】

    [摘要] Vue+ElementUI多页面打包改造 示例代码托管在:http://www.github.com/dashnowords/blogs 博客园地址:<大史住在大前端>原创博文目 ...

随机推荐

  1. 测试工程师想进BAT必须具备的几项素质

    我发现一个奇怪的现象:总是听到身边的程序员朋友谈论BAT(中国大陆互联网的三大巨头:百度.阿里.腾讯)以及如何进入BAT,却鲜少有测试会去谈论或者考虑这些问题. 我不知道这是为什么,或者我就算知道也只 ...

  2. Jquery如何使用动画效果改变背景色

    Jquery如何使用动画效果改变背景色 一.问题引入 jquery的animate动画虽然强大,但是无法使用其进行背景色(background-color)的动画效果变化,因为animate动画效果只 ...

  3. vue 表格使用el-select

    <el-table-column label="示例" width="210" align="center"> <temp ...

  4. k8s(00)入门知识介绍

    系列文章说明 本系列文章,可以基本算是 老男孩2019年王硕的K8S周末班课程 笔记,根据视频来看本笔记最好,否则有些地方会看不明白 需要视频可以联系我 k8s概念入门 目录 系列文章说明 k8s概念 ...

  5. 【Redis学习专题】- Redis主从+哨兵集群部署

    集群版本: redis-4.0.14 集群节点: 节点角色 IP redis-master 10.100.8.21 redis-slave1 10.100.8.22 redis-slave2 10.1 ...

  6. 01 shell编程之变量定义

    一.SHELL介绍 ㈠ 什么是shell脚本? 简单来说就是将需要执行的命令保存到文本中,按照顺序执行.它是解释型的,意味着不需要编译. 若干命令 + 脚本的基本格式 + 脚本特定语法 + 思想= s ...

  7. Linux系统中(CentOS 7)的用户和权限管理

    目录 用户和组 用户信息文件 用户密码信息 相关命令 用户管理 组管理 密码管理 权限管理 文件的详细信息 文件权限 相关命令 用户和组 用户信息文件 /etc/passwd (1 2 3 4 5 6 ...

  8. web自动化 -- Select(下拉选择框操作)

    目标:(现在 select 这种已经很少了.一般都是  ul/li 或者 span/svg) 代码示例:

  9. Bootstrap++:bootstrap-select 使用

    效果图: HTML: <!DOCTYPE html> <html lang="en" xmlns:th="http://www.thymeleaf.or ...

  10. Python os.removedirs() 方法

    概述 os.removedirs() 方法用于递归删除目录.像rmdir(), 如果子文件夹成功删除, removedirs()才尝试它们的父文件夹,直到抛出一个error(它基本上被忽略,因为它一般 ...