在Vue的webpack中结合runder函数

在Vue的webpack中结合runder函数

1.引入:

<h1>下面是vue的内容:</h1>

<div id="app">
      <login></login>
</div>

2.main.js

//默认无法打包vue文件 需安装vue-loader
import Vue from  'vue'
import  login from './login.vue'

var vm = new Vue({
    el:"#app",
    data:{
        msg:'123'
    },
    // components:{
    //     'login':login
    // },
    render:function (createElement) { //在webpack中如果需要vue放到页面中展示 vm实例中的render函数可以实现
        return createElement(login)
    }
    
})

3.拉取相关的loader

npm i vue-loader vue-template-compiler -D

4.在webpack.config.js中加入

const VueLoaderPlugin = require('vue-loader/lib/plugin');

module.exports = {

    devtool: "sourcemap",

    entry: './js/entry.js', // 入口文件

    output: {

        filename: 'bundle.js' // 打包出来的wenjian

    },

    plugins: [

        // make sure to include the plugin for the magic

        new VueLoaderPlugin()

    ],

    module : {

    ...

}

}

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏自由而无用的灵魂的碎碎念

去掉windows8.1鸡肋的开始按钮

可以使用我分享的链接下载startisgone: http://download.csdn.net/detail/wangallan/8972885

1022
来自专栏vue学习

小程序 — 保存图片到手机相册

(1)要保存图片到手机相册中,所以首先我们来看看保存图片的api方法是什么? 我们使用的是wx.saveImageToPhotosAlbum(OBJECT)这...

3111
来自专栏Android知识点总结

html5常用控件

6672
来自专栏Golang语言社区

go语言读取csv文件并输出的方法

本文实例讲述了go语言读取csv文件并输出的方法。分享给大家供大家参考。具体实现方法如下: package main import ( "encodi...

3808
来自专栏Play & Scala 技术分享

[Play-Scala-2.2.1] 接收jQuery Post的原始字符串请求

3258
来自专栏中国白客联盟

js之获取浏览器保存的账号密码(二)

正常情况下,当用户登录系统的时候保存了登录的账号密码的话,我们是可以利用js获取到他的表单里面的值发送过来,达到获取到他的账号密码进行下一步渗透。

9294
来自专栏互联网软件技术

Session过期,跳出iframe框架页显示会话过期页面

web开发中经常会有这种情况,在一个主页面中包含侧边导航菜单和iframe,点击菜单项,对应页面会在iframe中显示,整个页面不会刷新。但是如果设置了会话Se...

1624
来自专栏每日一篇技术文章

weex-12-组件switch

本节内容比较简单,创建一个switch.vue 来写本节的内容, 注意一点,本节内容请务必使用真机测试

5222
来自专栏Python自动化测试

页面对象的定位

在自动化的测试中,对象元素的定位和操作是自动化的核心部分,但是对象是定位是自动化的基础,在对象的基础上,才可以形成对对象的操作。

933
来自专栏静默虚空的博客

Intellij IDEA 使用小结

快捷键 核心快捷键 IntelliJ IDEA 作为一个以快捷键为中心的 IDE,为大多数操作建议了键盘快捷键。在这个主题中,您可以找到最不可缺少的列表,使 I...

3306

扫码关注云+社区

领取腾讯云代金券