¿Duplicado de # 1854?

Es similar, pero ahora el problema es por qué establecer
require('pixi.js')

node: {
    fs: "empty"
}

Todo funciona bien, pero no me gusta # 1854, muestra Uncaught TypeError: fs.readFileSync is not a function en alguna función como BlurFilter

Además ,

loaders: [{
    test: /\.json$/,
    include: path.join(__dirname, 'node_modules', 'pixi.js'),
    loader: 'json'
}

Si elimino include: path.join(__dirname, 'node_modules', 'pixi.js'),
pixi todavía funciona.

pero el mismo problema Uncaught TypeError: fs.readFileSync is not a function

No sé nada sobre webpack. Necesita tener una transformación que resuelva readFileSyncs en las cadenas reales del archivo como lo hace la transformación browserify.

Aquí está mi webpack.config de trabajo:

var webpack = require("webpack");

var path = require("path");

var config = {
    target: "web",
    debug: true,
    devtool: "source-map",
    entry: {
        main: "./source/scripts/main"
    },
    output: {
        path: "./build",
        filename: "[name].bundle.js",
        chunkFilename: "[id].bundle.js"
    },
    node: {  // this is for pixi.js 
        fs: "empty"
    },
    resolve: {
        modulesDirectories: ['web_modules', 'bower_components', 'node_modules']
    },
    module: {
        loaders: [
            { test: /\.css/, loader: "style-loader!css-loader" },
            { test: /\.less$/, loader: "style-loader!css-loader!less-loader" },
            { test: /\.jsx?$/, exclude: /(node_modules|bower_components)/, loader: 'babel?optional[]=runtime&stage=0'},
            { test: /\.png/, loader: "url-loader?limit=100000&mimetype=image/png" },
            { test: /\.gif/, loader: "url-loader?limit=100000&mimetype=image/gif" },
            { test: /\.jpg/, loader: "file-loader" },
            { test: /\.json/, loader: "json-loader" },
            { test: /\.(png|woff|woff2|eot|ttf|svg)$/, loader: 'url-loader?limit=100000' }
        ]
    },
    plugins: [
        //new webpack.optimize.UglifyJsPlugin(),
        //new webpack.optimize.DedupePlugin(),
        new webpack.DefinePlugin({
            __DEV__: true
        })
    ]
};
module.exports = config;

Cerrando como resuelto.

Este es el ejemplo más directo y simple de configuración de paquete web con PIXI que encontré.

https://gist.github.com/mjackson/ecd3914ebee934f4daf4

Recomiendo actualizar el campo main de package.json para hacer referencia a los archivos construidos en bin . Esta es una biblioteca que la mayoría de la gente usará en el cliente. Parece un poco extraño que no interopere con todas y cada una de las herramientas de compilación populares listas para usar.

Muchas (¿la mayoría?) De otras bibliotecas populares del lado del cliente hacen referencia a los archivos integrados en package.json para evitar problemas como este.

Funciona con browserify listo para usar, así como con el paquete web con la configuración adecuada. Los propios Webpack recomiendan que _no_ apunte al archivo compilado, sino a la fuente y configure las transformaciones adecuadas.

Es probable que en el futuro intentemos utilizar más transformaciones "compatibles con paquetes web", o incluir la configuración necesaria en nuestro paquete json para que no tenga que escribirla (como hacemos para browserify). Pero decir que no funciona con los constructores populares de fábrica simplemente no es cierto en absoluto, el paquete web es el único que necesita un poco de configuración para comenzar a funcionar.

@supermrji no funciona de inmediato con el paquete web.

No puedo entender, ¿cómo se resolvió finalmente este problema? Tengo el mismo problema al intentar usar jabón desde dentro de la aplicación de reacción.

@aasten tengo el mismo problema con el jabón y VUE-CLI ... ¿lo habéis solucionado?

@ Crawler158 no, lo siento.

¿nada?

Este hilo se ha bloqueado automáticamente ya que no ha habido ninguna actividad reciente después de que se cerró. Abra un nuevo problema para errores relacionados.