reactjs - 使用 create-react-app 构建转译第三方模块

标签 reactjs module webpack create-react-app

我正在开发一个最近弹出的 create-react-app应用程序并需要使用外部module .

我执行了npm install --save-dev starparam,并像这样导入模块:import starparam from 'starparam';

当我使用单元测试 (npm test) 在 NodeJS 中运行代码时,一切都会按预期运行。

但是,当我在浏览器中运行(使用 npm start)时,我收到语法错误。

这似乎是因为我正在使用的模块 uses ES6 features就像箭头函数一样。

我需要对 webpack 进行哪些更改才能将此第三方模块包含在转译中?

最佳答案

我能够通过以下方式实现我的目标:

  • config/paths.js 中添加新路径到第三方模块文件夹
  • loaders 中添加新加载程序 module 中的数组config/webpack.config.dev.js 中的对象
  • config/webpack.config.prod.js 中也有类似的变化

--

config/paths.js中添加新路径;

starparamSrc: resolveApp('node_modules/starparam'),

config/webpack.config.dev.js 中添加新的加载程序:

{
  test: /\.(js|jsx)$/,
  include: paths.starparamSrc,
  loader: 'babel',
  query: {
   cacheDirectory: true
  }
},

关于reactjs - 使用 create-react-app 构建转译第三方模块,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44805482/

相关文章:

webpack - 具有服务器端配置的静态 JavaScript 应用程序

node.js - Angular ,Webpack : build project into output path

reactjs - 如何扩展 React 类型以支持 html 属性作为 Prop ?

javascript - 如何使 "Ckeditor-5 document editor"禁用或只读

javascript - 带有构造函数的模块模式

java.lang.SecurityException : Cannot set up certs for trusted CAs (JBoss AS 7)

reactjs - 通过排序/分页向表格添加骨架效果

javascript - 无法构建 React/Next 项目 - 找到没有 React 组件的页面作为默认导出(上下文 api 文件)

react-native - 无法解析模块 'react-redux' ...模块 'react-redux' 在加速模块映射中不存在

css - 防止字体嵌入到 webpack 生成的 css 中