首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >WebPack导入另一个文件夹中的react自定义包

WebPack导入另一个文件夹中的react自定义包
EN

Stack Overflow用户
提问于 2018-07-25 15:39:42
回答 1查看 154关注 0票数 0

我正在用ReactJS增强一个网站。我的文件夹结构如下所示:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
 _npm
   node_modules
   package.json
   package-lock.json
   webpack.config.js
 _resources
   js
     react
       reactapp1.js
       reactapp2.js
       components
         FormDisplay.js

我想将一个自定义的reactjs包导入到FormDisplay组件中。当我进入时:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
import PlacesAutocomplete from 'react-places-autocomplete'

这不管用。但如果我进入:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
import PlacesAutocomplete from "./../../../_npm/node_modules/react-places-autocomplete";

这是可行的。我理解为什么会这样。我想知道有没有什么方法可以让我直接进入:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
import PlacesAutocomplete from 'react-places-autocomplete';

如何使其只使用这行代码,而不必查找node_modules文件夹路径?

我的webpack配置:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
const path = require("path");
const webpack = require("webpack");

const PATHS = {
    app: path.join(__dirname, "../_resources/react/"),
    build: path.join(__dirname, '../wordpress_site/wp-content/themes/custom_theme/assets/js/'),
  };

module.exports = {
    entry: {
        reactapp1: path.join(PATHS.app, "reactapp1.js"),
        reactapp2: path.join(PATHS.app, "reactapp2.js")
    },
    output: {
        filename: "[name].bundle.js",
        //path: path.join(__dirname,  "dist")
        path: PATHS.build
    },
    module:{
        rules: [
            {
                test: /\.js?$/,
                exclude: /(node_modules)/,
                use: {
                    loader: "babel-loader",
                    options: {
                        presets: ["env", "react"],
                        plugins: ["transform-class-properties"]
                    }
                }
            }

        ]// rules array
    }, // module
}
EN

回答 1

Stack Overflow用户

发布于 2018-07-25 15:51:35

你试过用webpack的resolve-modules吗?

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
 resolve: {
   modules: ['_npm/node_modules']
 }

可能行得通

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/51522877

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
查看详情【社区公告】 技术创作特训营有奖征文