小编Nic*_*vda的帖子

在Webpack中使用Bootstrap的首选方法

问候一个,所有,

我一直在玩Webpack的Bootstrap,但我正在把我的头发撕掉.我从字面上通过博客文章的负荷了,他们要么使用7个月过时"自举的WebPack"插件(其中,令人惊讶的不开箱的)或.它们包括引导文件通过进口"node_modules/*/自举/ CSS/bootstrap.css'.

当然,必须有一种更清洁,更有效的方法来解决这个问题吗?

这是我目前的webpack.config.js档案:

var webpack = require('webpack');
var ExtractTextPlugin = require('extract-text-webpack-plugin');
var autoprefixer = require('autoprefixer');
var path = require('path');

module.exports = {
    entry: {
        app: path.resolve(__dirname, 'src/js/main.js')
    },
    module: {
        loaders: [{
            test: /\.js[x]?$/,
            loaders: ['babel-loader?presets[]=es2015&presets[]=react'],
            exclude: /(node_modules|bower_components)/
        }, {
            test: /\.css$/,
            loaders: ['style', 'css']
        }, {
            test: /\.scss$/,
            loaders: ['style', 'css', 'postcss', 'sass']
        }, {
            test: /\.sass$/,
            loader: 'style!css!sass?sourceMap'
        },{
            test: /\.less$/,
            loaders: ['style', 'css', 'less']
        }, {
            test: /\.woff$/,
            loader: "url-loader?limit=10000&mimetype=application/font-woff&name=[path][name].[ext]"
        }, {
            test: …
Run Code Online (Sandbox Code Playgroud)

javascript babel twitter-bootstrap webpack vue.js

26
推荐指数
1
解决办法
1万
查看次数

React:AppStore监听器必须是一个函数

各位开发者!

感谢Egghead的教程,我一直在深入研究Flux/React.虽然我听说React正在移动,但是在遵循上述教程的同时,我在React库中遇到了一些变化.

到目前为止,我已经能够解决所有问题.现在,我遇到了关于商店的砖墙.正如教程所述,我正在制作一个购物车,用户可以在其中添加商品.没那么复杂.实际添加有效,但不会触发重新渲染.以下代码给出了添加的错误(完整代码也将在下面列出):

addChangeListener: function(callback) {
    this.on(CHANGE_EVENT, callback);
},
Run Code Online (Sandbox Code Playgroud)

这导致Uncaught TypeError:listener必须是一个函数.回调参数未定义(因此问题出在哪里).但是,因为我不仅仅是新的React的工作方式,我在查找问题方面遇到了麻烦.以下代码段是教程中的Store:

var AppStore = assign(EventEmitter.prototype, {

    emitChange: function() {
        this.emit(CHANGE_EVENT);
    },
    addChangeListener: function(callback) {
        this.on(CHANGE_EVENT, callback);
    },
    removeChangeListener: function(callback) {
        this.removeChangeListener(CHANGE_EVENT, callback);
    },
    getCart: function() {
        return _cartItems;
    },
    getCatalog: function() {
        return _catalog;
    },
    getCartTotals: function() {
        return _cartTotals();
    },
    dispatcherIndex: AppDispatcher.register(function (payload) {
        var action = payload.action;

        switch(action.actionType) {
            case AppConstants.ADD_ITEM:
                _addItem(payload.action.item);
                break;
            case AppConstants.REMOVE_ITEM:
                _removeItem(payload.action.index);
                break;
            case AppConstants.INCREASE_ITEM:
                _increaseItem(payload.action.index);
                break;
            case AppConstants.DECREASE_ITEM:
                _decreaseItem(payload.action.index);
                break;
        } …
Run Code Online (Sandbox Code Playgroud)

javascript reactjs

8
推荐指数
1
解决办法
1756
查看次数

Webpack不会在npm运行时生成包文件

问候一个,所有,

在做了React应用程序后,我决定深入研究Webpack.我是整个npm自动化领域的新人,在阅读了一本食谱和各种教程后,我不能让npm run dev我的应用程序捆绑.它在我运行时生成了一个完全正常的bundle.js webpack,但吸引我的是每当我改变某些东西时webpack都会生成一个物理文件.Gulp和Grunt可以为我做这件事,但我也想让它与webpack一起工作.

所以,不用多说,一些代码.我运行的npm run dev是这样定义的(package.json只是脚本部分*):

  "scripts": {
    "build": "webpack",
    "dev": "webpack-dev-server --devtool eval --progress --colors --hot --content-base build"
  }
Run Code Online (Sandbox Code Playgroud)

使用以下Webpack配置:

var webpack = require('webpack');
var path = require('path');

module.exports = {
    entry: path.resolve(__dirname, 'src/js/main.js'),
    output: {
        path: path.resolve(__dirname, 'dist'),
        filename: '/js/bundle.js',
        publicPath: '/'
    },
    devServer: {
        inline: true,
        contentBase: './dist'
    },
    module: {
        loaders: [
            {
                test: /\.jsx?$/,
                exclude: /(node_modules|bower_components)/,
                loader: 'babel',
                query: {
                    presets: ['es2015', 'react']
                }
            }
        ] …
Run Code Online (Sandbox Code Playgroud)

javascript node.js webpack webpack-dev-server

6
推荐指数
1
解决办法
4940
查看次数