1

我有一个使用 Webpack 和backbone.paginator 的小应用程序。没有 webpack 也能完美运行。

使用 webpack，当我在我的集​​合中需要主干.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，它仍然存在，但是当我定义一个视图时，它说它是未定义的。

4

0 回答 0