resolve alifd/next style issues

Author: ShMcK

web-app/.storybook/addons.ts

@@ -1,4 +1,3 @@
 import '@storybook/addon-actions/register'
 import '@storybook/addon-links/register'
-import '@storybook/addon-knobs/register'
-import '@storybook/addon-notes/register'
+import '@storybook/addon-knobs/register'

web-app/.storybook/config.ts

@@ -1,4 +1,6 @@
 import { configure } from '@storybook/react';
+import '@alifd/next/dist/next.css';
+
 // automatically import all files ending in *.stories.tsx
 const req = require.context('../stories', true, /\.stories\.tsx$/);
 

web-app/.storybook/webpack.config.js

@@ -3,11 +3,11 @@ const path = require('path')
 // see typescript setup
 // https://storybook.js.org/docs/configurations/typescript-config/
 module.exports = ({ config }) => {
-    config.module.rules.push({
-      test: /\.scss$/,
-      use: ['style-loader', 'css-loader', 'sass-loader'],
-      include: path.resolve(__dirname, '../'),
-    })
+  config.module.rules.push({
+    test: /\.scss$/,
+    use: ['style-loader', 'css-loader', 'sass-loader'],
+    include: path.resolve(__dirname, '../'),
+  })
   config.module.rules.push({
     test: /\.(ts|tsx)$/,
     loader: require.resolve('babel-loader'),

web-app/package-lock.json

@@ -5,7 +5,7 @@
   "dependencies": {
     "@alifd/next": "^1.15.5",
     "@types/jest": "^24.0.13",
-    "@types/node": "^12.0.4",
+    "@types/node": "^12.0.7",
     "@types/react": "^16.8.19",
     "@types/react-dom": "^16.8.4",
     "moment": "^2.24.0",

web-app/package.json

@@ -1,8 +1,5 @@
 import * as React from 'react'
-import Button from '@alifd/next/lib/button'
-import '@alifd/next/lib/button/style'
-import '@alifd/next/lib/button/style'
-import Card from '@alifd/next/lib/card'
+import { Button, Card } from '@alifd/next'
 
 interface Props {
   title: string

web-app/src/components/Continue/ContinueItem.tsx

@@ -1,8 +1,5 @@
 import * as React from 'react'
-import Button from '@alifd/next/lib/button'
-import '@alifd/next/lib/button/style'
-import Card from '@alifd/next/lib/card'
-import '@alifd/next/lib/card/style'
+import { Button, Card } from '@alifd/next'
 import CR from '../../../../src/typings'
 
 const styles = {

web-app/src/components/Level/index.tsx

@@ -1,6 +1,5 @@
 import * as React from 'react'
-import Button from '@alifd/next/lib/button'
-import '@alifd/next/lib/button/style'
+import { Button } from '@alifd/next'
 
 interface Props {
   onNew(tutorialId: string): void

web-app/src/components/New/index.tsx

@@ -1,9 +1,5 @@
 import * as React from 'react'
-import Button from '@alifd/next/lib/button'
-import '@alifd/next/lib/button/style'
-import Card from '@alifd/next/lib/card'
-import '@alifd/next/lib/card/style'
-
+import { Button, Card } from '@alifd/next'
 import CR from '../../../../src/typings'
 
 import Step from '../Step'

web-app/src/components/Stage/index.tsx

@@ -1,6 +1,5 @@
 import * as React from 'react'
-import Checkbox from '@alifd/next/lib/checkbox'
-import '@alifd/next/lib/checkbox/style'
+import { Checkbox } from '@alifd/next'
 // import CC from '../../typings/client'
 import CR from '../../../../src/typings'
 

web-app/src/components/Step/index.tsx

@@ -1,8 +1,5 @@
 import * as React from 'react'
-import Button from '@alifd/next/lib/button'
-import '@alifd/next/lib/button/style'
-import Card from '@alifd/next/lib/card'
-import '@alifd/next/lib/card/style'
+import { Button, Card } from '@alifd/next'
 import CR from '../../../../src/typings'
 
 const styles = {