搭建基础webpack+vue(二)

vue 收藏

 0  22

纵论 2020-07-09 11:35:33

积分：0

引入vue

main.js:

import Vue from 'vue';

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

index.html:


<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>

<body>
    <div id="app">
        {{message}}
    </div>
    <script src="/dist/build.js"></script>
    
</body>

</html>

webpack.config.js :

var path = require('path');
var webpack = require('webpack');

module.exports = {
    entry: './src/main.js',
    output: {
        path: path.resolve(__dirname, './dist'),
        publicPath: '/dist/',
        filename: 'build.js'
    },
    devServer: {
        historyApiFallback: true,
        overlay: true
    },
    resolve: {
        alias: {
            'vue$': 'vue/dist/vue.esm.js'
        }
    }
};

重新运行npm run dev

上一主题: vue.config.js webpack4.x删除控制台打印

下一主题: 搭建基础webpack+vue(一)

暂时没有人评论

精选帖子

热门帖子: 1git 命令  80; 2magento 2.4安装需先安装elasticsearch  69; 3在phtml中使用图片  56; 4magento 2 phtml使用block, phtml  47; 5magento 2 获取产品属性  45; 6grunt 编译  42; 7开启css关键路径提升加载速度  42; 8magento slick.js使用  42; 9获取可配置产品属性后获取简单产品属性  39