Riot.js 与 Webpack的集成

为了让 Webpack 支持 Riot.js 的 tag 格式文件，我们可以借助 riotjs-loader 这个被加入 Webpack loader list 的 loader ，同时，需要 babel 做代码编译（使用 jsx-loader 也可以，这取决于开发代码的模式），所以我们需要安装这些模块：

npm i riot riotjs-loader babel babel-core babel-loader --save-dev

安装完成后就可以配置 webpack.config.js 了:

    module:{
        //我们需要预载入riotjs-loader并配置它：
        preLoaders:[
            {test:/\.tag$/, loader:'riotjs?type=none'}
        ],
        //接着为tag文件指定loader：
        loaders:[
            {test:/\.tag$/,loader:'babel'}
        ]
    },
    plugins:[
        //用ProvidePlugin预置riot库，这样就不用再在每个页面中引入库文件了，webpack会将库文件一并打包进主文件中：
        new webpack.ProvidePlugin({
            riot: 'riot'
        })
    ]

接下来，我们只需要把 *.tag 文件以模块加载的方式引入到入口文件或者相应页面的脚本中：

require('../components/demo.tag');

就可以让 webpack 为 riot.js 干活了。