首页 > 解决方案 > 如何在 Nuxt 项目中设置 NativeScript Vue 代码共享项目

问题描述

我尝试使用 nativescript-vue-cli-plugin 在现有 Nuxt.js 项目中设置代码共享 NativeScript 项目。不幸的是,插件在安装后给我留下了几个错误。

  1. Nativescript Vue 似乎将所有组件文件解析为 nativescript 模板(当然失败了)。我可以将“web”属性附加到<template>我的项目中的每个,但是当我这样做时,nuxt 不再解析它们。如何实现 Nuxt 使用<template web>模板?

  2. Webpack 无法解析某些模块。例如,我想导入一个位于@mdi/font/css/materialdesignicons.css. Webpack 似乎将其视为./@mdi/font/css/materialdesignicons.css并且无法解决它。我该如何修改这个工作的 webpack 配置?

  3. 我用于 Web 版本的模块 compile-sass 会引发错误,因为它无法解析“child_process”。当我将它与 nuxt 一起使用时,不会出现该错误。我发现了一个在其他情况下解决此问题的问题,但该解决方案对我不起作用。

  4. 除非我tns preview直接运行 etc 而不是npm run preview:iosetc,否则 Nativescript 在项目根目录中找不到 nsconfig.js 中定义的 main.native.json 文件。这意味着它必须对npm run setup-webpack-config命令做一些事情。

其中一些问题对我的设置非常具体,因此我们将不胜感激有关如何在 Nuxt 项目中使用 Nativescript 代码共享的更通用指南。

标签: vue.jswebpacknativescriptnuxt.jsnativescript-vue

解决方案


推荐阅读