hinzufügen Vermögenswerte Ordner in Mern io

Question

i mern.io meine Web-Pack Config bin mit ist wie folgt aussieht:

var webpack = require('webpack'); 
var cssnext = require('postcss-cssnext'); 
var postcssFocus = require('postcss-focus'); 
var postcssReporter = require('postcss-reporter'); 

module.exports = { 
    devtool: 'cheap-module-eval-source-map', 

    entry: { 
    app: [ 
     'eventsource-polyfill', 
     'webpack-hot-middleware/client', 
     'webpack/hot/only-dev-server', 
     'react-hot-loader/patch', 
     './client/index.js', 
    ], 
    vendor: [ 
     'react', 
     'react-dom', 
    ], 
    }, 

    output: { 
    path: __dirname, 
    filename: 'app.js', 
    publicPath: 'http://0.0.0.0:8888/', 
    }, 

    resolve: { 
    extensions: ['', '.js', '.jsx'], 
    modules: [ 
     'client', 
     'node_modules', 
    ], 
    }, 

    module: { 
    loaders: [ 
     { 
     test: /\.css$/, 
     exclude: /node_modules/, 
     loader: 'style-loader!css-loader?localIdentName=[name]__[local]__[hash:base64:5]&modules&importLoaders=1&sourceMap!postcss-loader', 
     } 
     , { 
     test: /\.css$/, 
     include: /node_modules/ , 
     loaders: ['style-loader', 'css-loader'], 
     } 

     , { 
     test: /\.jsx*$/, 
     exclude: [/node_modules/, /.+\.config.js/], 
     loader: 'babel', 
     }, { 
     test: /\.(jpe?g|gif|png|svg)$/i, 
     loader: 'url-loader?limit=10000', 
     }, { 
     test: /\.json$/, 
     loader: 'json-loader', 
     }, 
     { test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: "url-loader?limit=1&minetype=application/font-woff" }, 
     { test: /\.(ttf|eot)(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: "url-loader?limit=1&minetype=application/font-woff" }, 


     { test: /\.svg(\?v=\d+\.\d+\.\d+)?$/, loader: 'url-loader?limit=1' } 
    ], 
    }, 

    plugins: [ 
    new webpack.HotModuleReplacementPlugin(), 
    new webpack.optimize.CommonsChunkPlugin({ 
     name: 'vendor', 
     minChunks: Infinity, 
     filename: 'vendor.js', 
    }), 
    new webpack.DefinePlugin({ 
     'process.env': { 
     CLIENT: JSON.stringify(true), 
     'NODE_ENV': JSON.stringify('development'), 
     } 
    }), 
    ], 

    postcss:() => [ 
    postcssFocus(), 
    cssnext({ 
     browsers: ['last 2 versions', 'IE > 10'], 
    }), 
    postcssReporter({ 
     clearMessages: true, 
    }), 
    ], 
}; 

ich möchte eine benutzerdefinierte CSS-Datei hinzufügen, die in residiert:/public/assets/css/Benutzerdefinierte CSS; Was wären dann meine Konfigurationen?

ich kann CSS-Datei in node_modules importieren zB: require ('rc-slider/assets/index.css');

wie heißt es in der config:

{ 
     test: /\.css$/, 
     include: /node_modules/ , 
     loaders: ['style-loader', 'css-loader'], 
     } 

i den Eintrag repliziert wurden mit:

{ 
     test: /\.css$/, 
     include: /public/ , 
     loaders: ['style-loader', 'css-loader'], 
     } 

aber nicht funktioniert

Answer 1

Es zwei Ansatz sein kann mit dieser Situation zu umgehen.

1. Sie können Folgendes zum Hinzufügen eines Öffentlichen Ordners zum Bereitstellen statischer Dateien verwenden. app.use (express.static ('öffentlich'));

Und dann können Sie die Datei in der HTML hinzufügen, wenn Sie serverseitige Rendering verwenden.

2.

können Sie diese Datei auf Client-Seite setzen und die Datei einfach an der Eintrittsstelle von webpack auf Client-Seite importieren. Und Webpack wird es automatisch mit Style Loader enthalten.