其他资源

Question

我有一个这样组织的项目（网络界面）：

    Directory: L:\root-of-project


Mode                LastWriteTime         Length Name
----                -------------         ------ ----
d-----       16/01/2019     11:25                .git
d-----       16/01/2019     11:38                node_modules
d-----       16/01/2019     11:25                src
-a----       16/01/2019     11:07            403 package.json
-a----       20/12/2018     17:13           2541 README.md
-a----       ...[OTHER FILES]...


    Directory: L:\root-of-project\src


Mode                LastWriteTime         Length Name
----                -------------         ------ ----
d-----       16/01/2019     11:10                main
d-----       16/01/2019     09:32                static
-a----       16/01/2019     11:25          23274 index.html


    Directory: L:\root-of-project\src\main


Mode                LastWriteTime         Length Name
----                -------------         ------ ----
d-----       16/01/2019     11:10                a-folder-with-js-files
d-----       16/01/2019     11:10                another-folder-with-js-files
d-----       ...[OTHER DIRECTORIES]...
d-----       16/01/2019     11:25                vue-components-folder
-a----       16/01/2019     11:08           5673 file1.js
-a----       15/01/2019     16:24           2830 file2.ts
-a----       ...[OTHER FILES]...


    Directory: L:\root-of-project\src\main\vue-components-folder


Mode                LastWriteTime         Length Name
----                -------------         ------ ----
d-----       16/01/2019     11:10                a-vue-component-folder
d-----       16/01/2019     11:10                another-vue-component-folder
d-----       ...[OTHER DIRCTORIES]...


    Directory: L:\root-of-project\src\main\vue-components-folder\a-vue-component-folder


Mode                LastWriteTime         Length Name
----                -------------         ------ ----
-a----       15/01/2019     21:16            389 a-vue-component.interface.ts
-a----       15/01/2019     16:14           4892 a-vue-component.js
-a----       15/01/2019     13:36            576 style.css

我正在尝试将其文件从JavaScript转换为Typescript，但在将Typescript与Vue.js结合使用时遇到了一些困难，而在模块方面还有其他困难：当我翻译Typescript模块时，浏览器无法读取它因为它抱怨所有模块都必须与index.html放在同一目录中（我得到的错误类似于该import statement may only appear at the top level）。

（上面列表中的某些文件已经是.ts，因为不包含对其他文件的依赖性）

我应该遵循哪种方法才能继续使用TypeScript将多个文件划分为多个文件夹？（有关更多信息，该项目托管于here。我正在使用VS Code进行开发）

Answer 1

当我翻译一个打字稿模块时，浏览器无法读取它，因为它抱怨所有模块必须与index.html放在同一目录中

您不应将模块发布到浏览器。相反，您应该使用webpack（https://webpack.js.org/）之类的东西将它们捆绑到浏览器中。

由于您有一个全栈应用程序，因此需要编译TS两次： *使用tsc一次访问node.js *一次用于使用webpack的浏览器

其他资源

I also have a free video on the subject。

将JS项目转换为TypeScript

1 个答案:

其他资源