首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >与Webpack一起使用Rails

与Webpack一起使用Rails
EN

Stack Overflow用户
提问于 2017-01-20 22:58:52
回答 1查看 2.4K关注 0票数 4

我使用的是ReactOnRails应用程序,我有使用npm安装的包的node-modules文件夹。我如何在app/assets/javascript/application.js中使用这些jquery库,这样我就不必在我的模块和Gemfile中安装javascript

这是我的webpack配置文件:

代码语言:javascript
运行
复制
/* eslint comma-dangle: ["error",
  {"functions": "never", "arrays": "only-multiline", "objects":
"only-multiline"} ] */

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

const devBuild = process.env.NODE_ENV !== 'production';
const nodeEnv = devBuild ? 'development' : 'production';

const config = {
  entry: [
    'es5-shim/es5-shim',
    'es5-shim/es5-sham',
    'babel-polyfill',
    './app/bundles/Home/startup/registration',
  ],

  output: {
    filename: 'webpack-bundle.js',
    path: '../app/assets/webpack',
  },

  resolve: {
    extensions: ['', '.js', '.jsx'],
    alias: {
      react: path.resolve('./node_modules/react'),
      'react-dom': path.resolve('./node_modules/react-dom'),
    },
  },
  plugins: [
    new webpack.DefinePlugin({
      'process.env': {
        NODE_ENV: JSON.stringify(nodeEnv),
      },
    }),
  ],
  module: {
    loaders: [
      {
        test: require.resolve('react'),
        loader: 'imports?shim=es5-shim/es5-shim&sham=es5-shim/es5-sham',
      },
      {
        test: /\.jsx?$/,
        loader: 'babel-loader',
        exclude: /node_modules/,
      },
    ],
  },
};

module.exports = config;

if (devBuild) {
  console.log('Webpack dev build for Rails'); // eslint-disable-line no-console
  module.exports.devtool = 'eval-source-map';
} else {
  config.plugins.push(
    new webpack.optimize.DedupePlugin()
  );
  console.log('Webpack production build for Rails'); // eslint-disable-line no-console
}
EN

回答 1

Stack Overflow用户

发布于 2017-05-03 15:52:37

Rails5.1附带了webpacker,并删除了默认的jquery-rails依赖,但如果你愿意,你仍然可以使用它。在模板中:

代码语言:javascript
运行
复制
<%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %>

将使用传统的资产管道(从app/assets/javascript/application.js)编译JS。

代码语言:javascript
运行
复制
<%= javascript_pack_tag 'application' %>

将使用webpacker从app/javascript/packs/application.js编译您的JS模块。您可以使用以下命令触发手动模块编译:

代码语言:javascript
运行
复制
rails webpacker:compile
票数 7
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/41766519

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档