1

我正在尝试异步加载 .json 文件。有 .js 文件的示例,但我使用的是打字稿,似乎找不到解决方案。

webpack.config.js

var webpack = require('webpack');

module.exports = {
    entry: "./src/app.ts",
    output: {
        path: './dist',
        filename: "bundle.js"
    },
    resolve: {
        extensions: ['', '.ts', '.tsx', '.js', '.jsx', '.json']
    },

    module: {
        loaders: [
            { test: /\.css$/, loader: "style!css" },
            { test: /\.ts$/, loader: 'ts-loader'},
            { test: /\.json$/, loader: 'json-loader'},
            {
                test: /jquery\.min\.js$/, 
                loader: 'expose?jQuery'
            },
            {
                test: /jquery\.min\.js$/, 
                loader: 'expose?$'
            }
        ]
    },
    plugins: [
        new webpack.ProvidePlugin({
            $: 'jquery',
            jQuery: 'jquery',
            'window.jQuery': 'jquery',
            'window.$': 'jquery'
        })
    ]
};

应用程序.ts

declare var require: {
    <T>(path: string): T;
    (paths: string[], callback: (...modules: any[]) => void): void;
    ensure: (paths: string[], callback: (require: <T>(path: string) => T) => void) => void;
};


require(['./assets/data.json'], function(data) {
    console.log(data); //doesn't log anything.
});

它在控制台中出现错误,

GET http://localhost:5557/1.bundle.js 404 (Not Found)

但是,如果我不尝试异步,它工作正常,

console.log(require('./assets/data.json')); // logs the json just fine

谢谢

4

1 回答 1

1

看起来 webpack 不知道在哪里可以找到你的包。

开始使用捆绑拆分后,您必须在配置中进行设置output.publicPath。如果您的dist目录在浏览器中可用,则localhost/dist必须设置output.publicPath/dist/(因为 publicPath 将作为 webpack 尝试加载的文件的前缀)。

于 2016-09-17T20:51:04.047 回答