Despite the body of this questioning appearing to deviate from the title, I am going to tackle the problem within the title: How do I import javascript files into my react components?
(尽管此问题的内容似乎与标题有所不同,但我将解决标题中的问题: 如何将javascript文件导入到我的react组件中?)
The answer is pretty simple.
(答案很简单。)
I chose to make a directory structure of:(我选择使目录结构为:)
-
./dummyDir
-
./dummyDir/react-src/
-
./dummyDir/react-src/src
This all can be seen within reactjs.org.
(所有这些都可以在reactjs.org中看到。)
And then, all of your react/javascript specific code will go in .../src/
.(然后,您所有的react / javascript特定代码都将放入.../src/
。)
So, you will have ./dummyDir/react-src/src/myJSFile.js
(因此,您将拥有./dummyDir/react-src/src/myJSFile.js
)
There are two more steps.
(还有两个步骤。)
The next step is being sure that you import
the javascript and any classes (assuming you do some oop) into your .jsx
file.(下一步是为确保您import
的JavaScript和任何类(假设你做一些OOP)到您的.jsx
文件。)
Now, you can call any of the methods within your old javascript files right into your react components.(现在,您可以在旧的javascript文件中直接调用您的react组件中的任何方法。)
The last step is hosting and deploying.
(最后一步是托管和部署。)
I won't go over hosting as much as hosting to a local environment.(与托管本地环境相比,我不会做太多托管工作。)
I test host with apachectl on my local machine, for example.(例如,我在本地计算机上使用apachectl测试主机。)
If that is the case for you, you might get hung up on not hosting from npm run serve
as it looks like you are trying to plugin react instead of start with react.(如果是这样,您可能会挂在不从npm run serve
托管而不挂机的情况下,因为您似乎在尝试插入react而不是从react开始。)
Thus, you will want a bash script with something like this:
(因此,您将需要具有以下内容的bash脚本:)
deploy () {
if [ ! -d build/ ]
then
echo -e "ERROR:
Does not appear to be correct directory;"
echo -e "Dir /build/ not found;"
return 1
fi
echo -e "STARTING:"
# Testing if build failed...
npm run build
if [ ! $? -eq 0 ] ;
then
printf "
npm run build has failed...
"
printf "
preserving previous ./build/
"
return 2
fi
if [ -d ../static/ ]
then
echo -e "REMOVING ../static/*"
rm -r ./../static/ || echo "WARNING: DID NOT REMOVE DIR"
else
echo -e "DID NOT FIND ../static/ FOR REMOVAL"
fi
# Redirecting the ls output to make it completely silent
if ls ../precache-manifest* 1> /dev/null 2>&1;
then
echo -e "REMOVING ../precach*"
rm -r ./../precache-manifest* || echo "WARNING: DID NOT REMOVE CACHE"
else
echo -e "DID NOT FIND ../static/ FOR REMOVAL"
fi
echo -e "RUNNING: npm run build"
echo -e "COPYING OVER NEW BUILD DIR"
cp -r build/* ../
echo -e "DONE"
return 0 #Bash is weird; 0 is true, 1 is false;
}
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…