Question

我关注了前端页面的webpack官方“入门”指南，我想知道它是否也打算在开发环境中使用。

我设法捆绑了所有的foo.js依赖项，但每次更改我的foo.js时是否必须再将所有内容捆绑在一起，还是有另一种方法可以编码并继续使用捆绑的依赖项？

webpack.config.js

var path = require('path');

module.exports = {
  entry: './foo.js',
  output: {
    path: path.resolve(__dirname, 'dist'),
    filename: 'foo.bundle.js'
  },
  resolve: {
        alias: {
            jquery: "jquery/src/jquery"
        }
    }
};

foo.js

require(['vue', 'jquery'], function(Vue, $){
    console.log(Vue);
    dynamo(Vue);
});

我计划的解决方法是定义一个window.dynamo闭包，该闭包在后续加载的webpack包中调用。 dynamo函数将导入dev版本foo.js（正在开发的版本）。

    <script>
    window.dynamo = function(Vue){
        console.log(Vue);
    }
    </script>
    <script src="/js/foo.bundle.js"></script>

您对webpack和开发环境有何看法？

Answer 1

我发现将--watch参数传递给webpack会让它看到所有文件并在修改后立即捆绑它们：

webpack.js --watch

同样@connexo指向使用https://github.com/vuejs-templates/webpack，我还没有尝试，因为它暗示了关于vue-cli的知识。但它绝对是下一步。

在开发环境中也使用webpack

1 个答案: