0

我在一个项目中工作，其中一些依赖项是自制的 UI 库组件。

这些组件有其适当的.css文件。源结构是这样的：

|- src
|-|
  |- components
  |-| 
    | Component
    |-|
      |- index.js
      |- Component.js
      |- Component.css

相同的结构发布在构建文件夹中，每个.js文件都转换为生产兼容的 JavaScript 格式。

我使用React-Starter-Kit使用此模块 vw 的项目，当我尝试使用yarn startor启动服务时npm start，出现以下错误：

SyntaxError: Unexpected token .
    at createScript (vm.js:53:10)
    at Object.runInThisContext (vm.js:95:10)
    at Module._compile (module.js:543:28)
    at Object.Module._extensions..js (module.js:580:10)
    at Module.load (module.js:488:32)
    at tryModuleLoad (module.js:447:12)
    at Function.Module._load (module.js:439:3)
    at Module.require (module.js:498:17)
    at require (internal/module.js:20:19)
    at Object.<anonymous> ([... path to my component inside node_modules]:13:15)
    at Module._compile (module.js:571:32)
    at Object.Module._extensions..js (module.js:580:10)
    at Module.load (module.js:488:32)
    at tryModuleLoad (module.js:447:12)
    at Function.Module._load (module.js:439:3)
    at Module.require (module.js:498:17)
/pathtomyproject/runServer.js:67
          throw new Error(`Server terminated unexpectedly with code: ${code} signal: ${signal}`);

我想问题是关于 babel 试图读取.css文件，但我想知道是否有人有一个很好的方法来避免这种问题，使用我现在使用的实际样板（React Starter Kit）。

更新

我忘了提这个。如果我使用相对路径 sintax 导入该模块：

import Component, { Styles } from '../../../node_modules/@scope/my-project/Component';

它按预期工作，显然有合成糖导入很好

谢谢。

4

1 回答 1

0

根据你的回答，我认为，进口必须是：

import Styles from './Component.css',

需要添加 .css 扩展名以表明它不是 .js 并且必须由 css-loaders（如果使用 webpack）或其他工具处理。

于 2017-04-20T18:22:41.120 回答