使用Ampersand.js路由模块化应用程序？

Question

我正在尝试使用Ampersand.js编写我的第一个模块化应用程序，但我遇到了一些问题！希望有人能给我指引正确的方向。

好了，我已经将Watchify和Browserify配置到我的html文件中，以创建一个bundled.js文件，该文件将在每次我进行更改时重新编译。然后我想添加一个&模块- ampersand-router (作为npm install --save ampersand-router安装在终端中)，以指定我想要处理的所有应用程序路由，并在用户遇到不可用的路由时重定向用户。

问题是没有重定向我的#路由，我不知道为什么！因为我没有服务器(或者这个项目需要一个)，所以我尝试使用基于#的路由，我想让它处理三个路由，一个空路由(我的起点)，一个gif/id路由和一个将重定向到起点的catch路由。

所以我的文件结构包含一个router.js:-

'use strict';
var AmpersandRouter = require('ampersand-router');
module.exports = AmpersandRouter.extend({
routes:{
    '': 'gifs', //empty
    'gif/:id': 'gif',
    'catch': 'catch' //catch and redirect
},
gifs: function(){
    console.log('gifs page');
},

gif: function(id){
    console.log('gif page', id);
},
'catch': function(){
    this.redirectTo('');
}

})；

和一个app.js文件：

var Router = require('./router.js');
window.app = {
init: function () {
    console.log('hello world');
    this.router = new Router();
    this.router.history.start();
}
};
window.app.init();

这些都是在我的index.html和下面的package.json代码中汇编的<script src = "bundled.js"></script>

"scripts": {
"start": "watchify js/app.js -o bundled.js",
"build": "browserify js/app.js -o bundled.js"

任何帮助都将不胜感激！谢谢大家！

Answer 1

会发生什么？有什么错误吗？此外，您可以尝试跳到项目聊天中，并在那里询问：https://gitter.im/AmpersandJS/AmpersandJS

Answer 2

尝试禁用pushState

this.router.history.start({pushState: false});

当它被启用时，#-fallback将不起作用。

Answer 3

你有没有试过在你的基本目录中使用'npm start‘？

我还没有把Ampersand.js放到一个超文本标记语言文件中，但它似乎可以与纯Javascript一起工作。