vue之webpack安装配置vue

一、介绍

  vue的runtime-only版本和runtime-compiler版本:

    runtime-only版本:代码中不可以有任何的template

    runtime-compiler版本:代码中可以有template,此版本有编译template的代码

二、vue安装

  1. 安装方式:

    下载js文件安装;CDN安装;npm安装

  2. npm安装:

    环境:node环境

     npm install vue --save :vue在运行时也需要,所以不要加-dev

三、vue的使用配置

  1. 导入vue:

     import Vue from 'vue' 

    说明:在没有建立导入的对应目录时,webpack会从mode_modules中找

  2. 使用vue

    new Vue

    说明:在使用vue时,默认使用runtime-only版本,所以可能会导致没有效果;解决方法一:在webpack.config.js文件中添加配置

module.exports = {
    resolve: {
        // 配置别名
        alias: {
            // 使用vue时,从指定别名的文件导入
            'vue$': 'vue/dist/vue.esm.js'
        } 
    }
}

       解决方法二:安装 vue-template-compiler 模块

         npm install vue-template-compiler 

日期:2021-10-20

posted @ 2021-10-20 20:37  xiao_lin  阅读(869)  评论(0编辑  收藏  举报