Backbone Paginator打破了Webpack

时间:2016-10-31 16:31:10

标签: javascript backbone.js webpack backbone.paginator

我有一个使用Webpack和backbone.paginator的小应用程序。没有webpack,它可以很好地工作。

使用webpack,当我在我的集​​合中需要backbone.paginator时,它会彻底破坏应用程序。我甚至不必使用分页器,只需要它就会破坏应用程序。它实际上会创建一个可分页的集合并且可以正常工作,但如果我在需要paginator之后尝试创建一个视图,它会说Backbone.Marionette没有定义。

以下是模型:

 var User = require("../models/User");
 var PageableCollection = require("backbone.paginator");

 var Users = Backbone.PageableCollection.extend({
  url: 'http://localhost:8000/api/users',
  model: User,
});

module.exports = Users;

如果有任何观点,一旦我需要,就会出现错误。如果我删除了require(' backbone-paginator'),则没有错误。

这是我的webpack.config.js:

const webpack = require("webpack");
const path = require("path");

var HtmlWebpackPlugin = require("html-webpack-plugin");
var HtmlWebpackPluginConfig = new HtmlWebpackPlugin({
  template: path.join(__dirname, 'app', 'index.html'),
  filename: 'index.html',
  inject: 'body'
});

var paths = {
  ENTRY: path.join(__dirname, 'app', 'main.js'),
  OUTPUT_FILENAME: "bundle.js",
  OUTPUT: path.join(__dirname, "app", 'static'),
  APP: path.join(__dirname, 'app')
};

module.exports = {
  entry: [
    paths.ENTRY
  ],
  devServer: {
    contentBase: "./app"
  },
  resolve: {
    alias: {
      "marionette": "backbone.marionette"
    }
  },
  module: {
    preLoaders: [
     {
       test: /\.js$/,
       include: __dirname + '/app',
       exclude: [/node_modules/, paths.APP + '/public', paths.APP + '/bower_components'],
       loader: 'jshint-loader'
      }
    ],
    loaders: [
      { test: /\.html/, include: paths.APP + '/templates', loader:     "underscore-template-loader" }
    ],
  },
  output: {
    filename: paths.OUTPUT_FILENAME,
    path: paths.OUTPUT
  },
  plugins: [
    HtmlWebpackPluginConfig,
    new webpack.ProvidePlugin({
      $: 'jquery',
      _: 'underscore'
    }),
    new webpack.DefinePlugin({
      'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV)
    }),
    // new webpack.optimize.DedupePlugin(),
    // new webpack.optimize.OccurenceOrderPlugin(),
    // new webpack.optimize.UglifyJsPlugin({
    //   compress: { warnings: false },
    //   mangle: true,
    //   sourcemap: false,
    //   beautify: false,
    //   dead_code: true
    // })
  ]
};

编辑:我删除了几乎所有内容并将其简化为:

var Marionette = require('marionette');
var PageableCollection = require("backbone.paginator")

var Users = Backbone.PageableCollection.extend({
  url: 'http://localhost:8000/api/users'
})

var UsersView = Backbone.Marionette.View.extend({
  tagName: 'div',
  template: _.template("hello")
})

在要求backbone.paginator后,我不允许定义视图。如果我是console.log Marionette,它仍然存在,但是当我定义一个视图时,它说它是未定义的。

0 个答案:

没有答案