在Riot JS中无法在服务器端要求标记

时间:2017-04-03 20:19:11

标签: javascript node.js express riotjs

当我声明:require('./public_html/Tags/blog_post_details.tag')时,我收到以下错误:

E:\WORKSPACE\NETBEANS_WORKSPACE\MyProject\public_html\Tags\blog_post_details.tag:1
(function (exports, require, module, __filename, __dirname) { <blog_post_details >
                                                              ^

SyntaxError: Unexpected token <
    at exports.runInThisContext (vm.js:53:16)
    at Module._compile (module.js:387:25)
    at Object.Module._extensions..js (module.js:422:10)
    at Module.load (module.js:357:32)
    at Function.Module._load (module.js:314:12)
    at Module.require (module.js:367:17)
    at require (internal/module.js:20:19)
    at Object.<anonymous> (E:\WORKSPACE\NETBEANS_WORKSPACE\MyProject\server.js:7:1)
    at Module._compile (module.js:413:34)
    at Object.Module._extensions..js (module.js:422:10)

路径正确,因为此行有效var commonsFile = require('./public_html/Tags/commons.json');

WebPack配置文件:

var path = require('path');
var webpack = require('webpack');
module.exports = {
    entry: './index.js',
    output: {
        path: __dirname,
        filename: 'public_html/assets/js/bundle.js'
    },
    resolveLoader: {
        root: path.join(__dirname, 'node_modules')
    },

    module: {
        preLoaders: [{
            test: /\.tag$/,
            exclude: /node_modules/,
            loader: 'riotjs-loader',
            query: {
                //type: 'none'
                //compact: true
            }
        }],
        loaders: [
            /*{
                test: /\.tag$/,
                loader: 'tag',
                exclude: /node_modules/
            },*/
            {
                test: /\.js$/,
                loader: 'babel-loader',
                exclude: /node_modules/,
                query: {
                    //commenting because of this issue https://github.com/mapbox/mapbox-gl-js/issues/3422
                   // presets: ['es2015']
                }
            }
        ]
    },
    plugins: [
        new webpack.optimize.OccurenceOrderPlugin(),
        new webpack.ProvidePlugin({
            riot: 'riot'
        })
    ]
};

1 个答案:

答案 0 :(得分:1)

节点require函数仅识别Javascript文件以.js结尾的文件,JSON文件以.json结尾,以及Node运行时的二进制扩展.node。对于Javascript文件,如果Node的模块系统(即.js下)可以找到文件或模块,则可以省略尾随node_modules

在您的示例中,您似乎尝试使用客户端代码中的require。除非您使用browserifywebpack或其他提供客户端版本require的客户端捆绑包,否则您无法使用它。

如下面的评论中所述,您提供的视频链接会通过webpack显示客户端代码加载代码文件。您需要检查webpack的配置,以确保它正确捆绑您的标签文件以便传送到浏览器。再次从视频中,示例代码从./tags/filename.tag加载其标记文件,其中该路径的根由webpack定义。